repeat()
CSS repeat() funksiyasi grid’dagi ustunlar yoki qatorlar to‘plamini takrorlash uchun ishlatiladi.
Bu funksiya grid’da qatorlar yoki ustunlar soni ko‘p bo‘lganda foydali. Bu funksiya yordamida ishlatiladigan "takrorlanish andozasi" (repeat-pattern) yaratasiz.
Bu funksiya grid-template-columns va grid-template-rows xususiyatlari bilan ishlatiladi.
Misol
Grid’dagi ustunlar to‘plamini takrorlash uchun repeat() funksiyasidan foydalaning:
#container {
display: grid;
grid-template-columns: repeat(2, 60px 1fr);
grid-gap: 7px;
background-color: green;
padding: 7px;
}
O‘zingiz sinab ko‘ring »
Quyida ko‘proq "O‘zingiz sinab ko‘ring" misollari keltirilgan.
Brauzerlarda qo‘llab-quvvatlash
Jadvaldagi sonlar funksiyani to‘liq qo‘llab-quvvatlaydigan birinchi brauzer versiyasini ko‘rsatadi.
| Funksiya | |||||
|---|---|---|---|---|---|
| repeat() | 57 | 16 | 76 | 10.1 | 44 |
CSS sintaksisi
repeat(repeat-count, tracks)
| Qiymat | Tavsif |
|---|---|
| repeat-counts | Majburiy. Ustunlar yoki qatorlar necha marta takrorlanishi kerakligini belgilaydi. 1 yoki undan katta butun son yoki auto-fill yoki auto-fit kalit so‘zi bo‘lishi mumkin (ular ustunlar/qatorlarni grid konteynerini to‘ldirish uchun kerakli marta takrorlaydi) |
| tracks | Majburiy. Takrorlanadigan ustunlar yoki qatorlar to‘plamini belgilaydi. Quyidagi qiymatlardan foydalanish mumkin:
|
| Versiya: | CSS Grid Layout moduli, 2-daraja |
|---|
Ko‘proq misollar
Misol
Grid’dagi ustunlar to‘plamini takrorlash uchun repeat() funksiyasidan foydalaning:
#container {
display: grid;
grid-template-columns: repeat(4, auto);
grid-gap: 7px;
background-color: green;
padding: 7px;
}
O‘zingiz sinab ko‘ring »
Tegishli sahifalar
CSS ma’lumotnomasi: CSS grid-template-columns xususiyati.
CSS ma’lumotnomasi: CSS grid-template-rows xususiyati.
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!