Функция repeat() в CSS Grid работает для упрощения записи при создании большого количества столбцов или строк. 2 Она позволяет сделать правила короче и понятнее. 2

Функция принимает два аргумента, разделённых запятой: 1

1. Первое значение — это количество повторений. 2 Оно может быть числом (например, 1, 2, 3) или ключевыми словами auto-fit или auto-fill. 1 Числовое значение задаёт конкретное количество дорожек, а auto-fit и auto-fill позволяют изменять количество дорожек в зависимости от доступного пространства. 1
2. Второе значение — это размер повторяющихся дорожек сетки. 2 Для этого аргумента можно использовать значения длины в единицах fr, px, em, % и ch. 1

Например, вместо записи grid-template-columns: 1fr 1fr 1fr 1fr 1fr; можно написать grid-template-columns: repeat(5, 1fr);. 1 В этом примере функция repeat() позволяет указать, сколько колонок нужно (5) и какой они должны быть ширины (1fr — одна доля доступного пространства). 1