grid-auto-rows
Misol
Griddagi qatorlar uchun standart o‘lcham o‘rnating:
.grid-container {
display: grid;
grid-auto-rows: 150px;
}
O‘zingiz sinab ko‘ring »
Ta’rif va qo‘llanilishi
grid-auto-rows xususiyati grid konteynerdagi qatorlar uchun o‘lcham o‘rnatadi.
Bu xususiyat faqat o‘lchami o‘rnatilmagan qatorlarga ta’sir qiladi.
| Standart qiymat: | auto |
|---|---|
| Meros qilinadi: | yo‘q |
| Animatsiya qilinadi: | ha. animatable haqida o‘qing Sinab ko‘ring |
| Versiya: | CSS Grid Layout moduli, 1-daraja |
| JavaScript sintaksisi: | object.style.gridAutoRows="60px" Sinab ko‘ring |
Brauzerlarda qo‘llab-quvvatlash
Jadvaldagi sonlar xususiyatni to‘liq qo‘llab-quvvatlaydigan birinchi brauzer versiyasini ko‘rsatadi.
| Xususiyat | |||||
|---|---|---|---|---|---|
| grid-auto-rows | 57 | 16 | 52 | 10 | 44 |
CSS sintaksisi
grid-auto-rows: auto|fit-content()|max-content|min-content|minmax()|length|%|initial|inherit;
Xususiyat qiymatlari
| Qiymat | Tavsif | Demo |
|---|---|---|
| auto | Standart qiymat. Qatorlar o‘lchami qatordagi eng katta element o‘lchamiga qarab aniqlanadi | Demo ❯ |
| fit-content() | Qatorlar o‘lchamini uzunlik yoki % bilan o‘rnatadi: qatorlar mavjud bo‘sh joydan foydalanadi, lekin hech qachon max-content o‘lchamidan kattalashmaydi | |
| max-content | Har bir qator o‘lchamini qatordagi eng katta elementga bog‘liq qilib o‘rnatadi | Demo ❯ |
| min-content | Har bir qator o‘lchamini qatordagi eng kichik elementga bog‘liq qilib o‘rnatadi | Demo ❯ |
| minmax() | O‘lcham oralig‘ini belgilaydi: min qiymatdan katta yoki unga teng va max qiymatdan kichik yoki unga teng | |
| length | Qatorlar o‘lchamini ruxsat etilgan uzunlik qiymati orqali o‘rnatadi. Uzunlik birliklari haqida o‘qing | Demo ❯ |
| % | Qatorlar o‘lchamini foiz qiymati orqali o‘rnatadi | |
| initial | Bu xususiyatni standart qiymatiga o‘rnatadi. initial haqida o‘qing | |
| inherit | Bu xususiyatni ota elementidan meros qilib oladi. inherit haqida o‘qing | |
Tegishli sahifalar
CSS darsligi: CSS Grid maketi
CSS ma’lumotnomasi: grid-auto-columns xususiyati
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!