Jadval — bu qatorlar va ustunlar to’plami.
HTML jadval ma’lumotlarini (satr va ustunlarga tuzilgan ma’lumotlarni) ko’rsatish uchun jadvallarni qo’llab-quvvatlaydi.
Jadval
tegi yordamida yaratiladi:
by carbon from @ozbekdasturchi
Jadval qatorlari
tegi jadvalning har bir satri uchun
tegini o’z ichiga olishi kerak.
HTML
Yuqoridagi kod jadvalda ikkita qator hosil qiladi.
Jadval katakchalari
tegi jadval katakchasini yaratadi, u |
ichida joylashgan va hujayra tarkibini o’z ichiga oladi:
Bu har bir satrda ikkita katakdan iborat ikkita qatorli jadval hosil qiladi.
by carbon @ozbekdasturchi
tegi
tegida va
| tegi |
tegida ishlatiladi
jadvalda qator yaratish
| jadval qatorida katak yaratish uchun kerakdir
Jadval
Ko’pgina brauzerlar, standart bo’yicha, jadval uchun chegarani o’z ichiga olmaydi.
Chegara atributidan foydalangan holda hujayralarni ko’rish uchun chegara qo’shishimiz mumkin:
Yaxshiroq va ilg’or uslublar CSS yordamida amalga oshiriladi, biz buni keyingi modulda bilib olamiz.
Chegara uchun standart rang har doim «qora» bo’ladi va standart o’lcham «1» bo’ladi. Siz uni har doim atributlar yoki CSS bilan o’zgartirishingiz mumkin 🙂
Chegaraning standart rangi har doim qora, lekin siz uni atribut yordamida o’zgartirishingiz mumkin: bordercolor = «yashil». Keyinchalik, siz har doim jadvalni CSS bilan shakllantirishingiz kerak, ammo bu siz buni qilolmaysiz degani emas.
by carbon @ozbekdasturchi
Sarlavhalar
|
tegi |
ga o’xshaydi va jadvalga sarlavha qo’shish uchun ishlatiladi.
Sarlavha — bu katak yoki qator mazmunini belgilaydigan |
katakchalar to’plami. Ular avtomatik ravishda hujayraning markaziga joylashtiriladi va qalin:
Sarlavha uchun yangi qator va ikkita |
katak qo’shdik, ular har bir ustunning teglarini o’z ichiga oladi.
Shuningdek,
Sarlavha
teglari yordamida butun jadval uchun sarlavha qoʻshishingiz mumkin.
|
teglari funksional jihatdan |
teglariga o’xshaydi. Ularning ikkalasi ham |
teglari ichiga joylashtirilishi kerak, chunki ikkalasi ham qatorning bir qismi bo’lishi kerak.
Yana bir foydali atribut — bu ustunga bir nechta hujayralarni qamrab olish imkonini beruvchi colspan.
Misol uchun, jadvalimiz uchun yuqori sarlavha katakchasini qo’shamiz va uni 3 ta ustunga aylantiramiz:
Colspan atributi biz uni qamrab oladigan hujayralar sonini belgilaydi.
Shuni yodda tutingki, colspan=»tanlangan raqam» atributi jadval katakchalarini jadval katakchalarini birlashtirish uchun emas, balki siz tanlagan jadval katakchalari sonining maydonini egallashga majbur qiladi.
by carbon @ozbekdasturchi
Bir nechta ustunlarni qamrab olgani kabi, hujayra ham bir nechta satrlarni qamrab olishi mumkin.
Bunga rowspan atributi yordamida erishiladi.
by carbon @ozbekdasturchi