27 lines
1.5 KiB
Markdown
27 lines
1.5 KiB
Markdown
---
|
||
title: Create Flexible Layouts Using auto-fill
|
||
localeTitle: Создание гибких макетов с использованием автозаполнения
|
||
---
|
||
## Создание гибких макетов с использованием автозаполнения
|
||
|
||
Эта задача будет объясняться предыдущей задачей, добавляя значение **автозаполнения** к функции _повтора_ . Это приведет к тому, что число divs будет расширяться в зависимости от размера окна просмотра, а не ранее указанного значения столбца. В приведенном ниже разделе « **Before** » указано значение «3» **таблицы-сетки-шаблона** .
|
||
|
||
_Имейте в виду, что следующие фрагменты кода - это только примеры, а не точная запись из учебного плана FreeCodeCamp._
|
||
|
||
### До
|
||
|
||
```css
|
||
grid-template-columns: repeat(3, minmax(50px, 2fr));
|
||
```
|
||
|
||
### После
|
||
|
||
```css
|
||
grid-template-columns: repeat(auto-fill, minmax(50px, 2fr));
|
||
```
|
||
|
||
* * *
|
||
|
||
### Ресурсы
|
||
|
||
Вы можете обратиться к **разделу Синтаксис** следующей страницы, чтобы увидеть значение **автозаполнения** : [Сеть разработчиков Mozilla](https://developer.mozilla.org/en-US/docs/Web/CSS/repeat) |