table-layout
Misol
Turli jadval joylashuvi algoritmlarini o‘rnating:
table.a {
table-layout: auto;
width: 180px;
}
table.b {
table-layout: fixed;
width: 180px;
}
O‘zingiz sinab ko‘ring »
Ta’rif va qo‘llanilishi
table-layout xususiyati jadval kataklari, qatorlari va ustunlarini joylashtirish uchun ishlatiladigan algoritmni belgilaydi.
Maslahat: table-layout: fixed; ning asosiy afzalligi — jadval ancha tez render qilinadi. Katta jadvallarda brauzer butun jadvalni render qilib bo‘lmaguncha foydalanuvchilar jadvalning hech bir qismini ko‘rmaydi. Shuning uchun table-layout: fixed ishlatsangiz, brauzer jadvalning qolgan qismini yuklab, render qilayotgan paytda foydalanuvchilar jadvalning yuqori qismini ko‘rib turadi. Bu sahifa ancha tez yuklanayotgandek taassurot qoldiradi!
| Standart qiymat: | auto |
|---|---|
| Meros qilinadi: | yo‘q |
| Animatsiya qilinadi: | yo‘q. animatable haqida o‘qing |
| Versiya: | CSS2 |
| JavaScript sintaksisi: | object.style.tableLayout="fixed" Sinab ko‘ring |
Brauzerlarda qo‘llab-quvvatlash
Jadvaldagi sonlar xususiyatni to‘liq qo‘llab-quvvatlaydigan birinchi brauzer versiyasini ko‘rsatadi.
| Xususiyat | |||||
|---|---|---|---|---|---|
| table-layout | 14.0 | 5.0 | 1.0 | 1.0 | 7.0 |
CSS sintaksisi
table-layout: auto|fixed|initial|inherit;
Xususiyat qiymatlari
| Qiymat | Tavsif | Demo |
|---|---|---|
| auto | Brauzerlar avtomatik jadval joylashuvi algoritmidan foydalanadi. Ustun kengligi kataklardagi eng keng bo‘linmaydigan kontent bo‘yicha belgilanadi. Joylashuvni kontent belgilaydi | Demo ❯ |
| fixed | Qat’iy jadval joylashuvi algoritmini o‘rnatadi. Jadval va ustun kengliklari table va col kengliklari yoki birinchi qatordagi kataklar kengligi bo‘yicha belgilanadi. Boshqa qatorlardagi kataklar ustun kengliklariga ta’sir qilmaydi. Agar birinchi qatorda kengliklar ko‘rsatilmagan bo‘lsa, kataklardagi kontentdan qat’i nazar, ustun kengliklari jadval bo‘ylab teng taqsimlanadi | Demo ❯ |
| 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 jadvallar
HTML DOM ma’lumotnomasi: tableLayout xususiyati
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!