, чтобы сохранить свой прогресс
Уменьшить повторение с помощью функции повтора
Когда вы использовали grid-template-columns и grid-template-rows для определения структуры сетки, вы ввели значение для каждой строки или столбца, который вы создали. Допустим, вам нужна сетка со 100 рядами одинаковой высоты. Внести 100 значений по отдельности не очень удобно. К счастью, есть лучший способ - с помощью функции repeat указать количество раз, когда вы хотите repeat свой столбец или строку, а затем запятую и значение, которое вы хотите повторить. Вот пример, который создавал бы сетку из 100 строк, каждая строка была бы высотой 50 пикселей.
grid-template-rows: repeat (100, 50px);Вы также можете повторить несколько значений с помощью функции повтора и вставить функцию среди других значений при определении структуры сетки. Вот что я имею в виду:
grid-template-columns: repeat (2, 1fr 50px) 20px;Это означает:
grid-template-columns: 1fr 50px 1fr 50px 20px;Заметка
1fr 50px повторяется дважды, затем 20px.Используйте repeat чтобы удалить повторение из свойства grid-template-columns .
/**
* Your test output will go here.
*/