Html jadvallar

@ozbekDasturchi

Jadvallar

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 <table> tegi yordamida yaratiladi:
<table>
</table>

Jadval qatorlari

<table> tegi jadvalning har bir satri uchun <tr> tegini o'z ichiga olishi kerak.
<table>
<tr></tr>
<tr></tr>
</table>
HTML
Yuqoridagi kod jadvalda ikkita qator hosil qiladi.

Jadval katakchalari

<td> tegi jadval katakchasini yaratadi, u <tr> ichida joylashgan va hujayra tarkibini o'z ichiga oladi:
Bu har bir satrda ikkita katakdan iborat ikkita qatorli jadval hosil qiladi.

<tr> tegi <table> tegida va <td> tegi <tr> tegida ishlatiladi <tr> jadvalda qator yaratish <td> 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.

Sarlavhalar

<th> tegi <td> ga o'xshaydi va jadvalga sarlavha qo'shish uchun ishlatiladi.
Sarlavha - bu katak yoki qator mazmunini belgilaydigan <th> katakchalar to'plami. Ular avtomatik ravishda hujayraning markaziga joylashtiriladi va qalin:
Sarlavha uchun yangi qator va ikkita <th> katak qo'shdik, ular har bir ustunning teglarini o'z ichiga oladi.

Shuningdek, <caption> Sarlavha </caption> teglari yordamida butun jadval uchun sarlavha qoʻshishingiz mumkin.

<th> teglari funksional jihatdan <td> teglariga o'xshaydi. Ularning ikkalasi ham <tr> 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.

Bir nechta ustunlarni qamrab olgani kabi, hujayra ham bir nechta satrlarni qamrab olishi mumkin.
Bunga rowspan atributi yordamida erishiladi.

Siz uchun saralangan maqolalar:

Html listlar haqida ma`lumotlar:

https://telegra.ph/Html-listlar-by-ozbekdasturchi-03-23

Gml nima?

https://teletype.in/@ashurovblog/GML

Html otasi kim aslida?

https://teletype.in/@ashurovblog/CharlesGoldfrab

keyingi maqolalarda ko`rishguncha

good bay

@ozbekdasturchi