HTML jadvallar
HTML jadvallari veb-dasturchilarga ma’lumotlarni qatorlar va ustunlarga tartiblash imkonini beradi.
Misol
| Company | Contact | Country |
|---|---|---|
| Alfreds Futterkiste | Maria Anders | Germany |
| Centro comercial Moctezuma | Francisco Chang | Mexico |
| Ernst Handel | Roland Mendel | Austria |
| Island Trading | Helen Bennett | UK |
| Laughing Bacchus Winecellars | Yoshi Tannamuri | Canada |
| Magazzini Alimentari Riuniti | Giovanni Rovelli | Italy |
HTML jadvalni belgilash
HTML jadvali qatorlar va ustunlar ichidagi jadval katakchalaridan tashkil topadi.
Misol
Oddiy HTML jadvali:
<table>
<tr>
<th>Company</th>
<th>Contact</th>
<th>Country</th>
</tr>
<tr>
<td>Alfreds Futterkiste</td>
<td>Maria
Anders</td>
<td>Germany</td>
</tr>
<tr>
<td>Centro
comercial Moctezuma</td>
<td>Francisco
Chang</td>
<td>Mexico</td>
</tr>
</table>
O‘zingiz sinab ko‘ring »
Jadval kataklari
Har bir jadval katakchasi <td> va </td> teglari bilan belgilanadi.
td — table data (jadval ma’lumoti) degani.
<td> va </td> orasidagi hamma narsa jadval katakchasining kontentidir.
Misol
<table>
<tr>
<td>Emil</td>
<td>Tobias</td>
<td>Linus</td>
</tr>
</table>
O‘zingiz sinab ko‘ring »
Eslatma: Jadval katakchasi har xil turdagi HTML elementlarini o‘z ichiga olishi mumkin: matn, rasmlar, ro‘yxatlar, havolalar, boshqa jadvallar va h.k.
Jadval qatorlari
Har bir jadval qatori <tr> bilan boshlanadi va
</tr> tegi bilan tugaydi.
tr
— table row (jadval qatori) so‘zining qisqartmasi.
Misol
<table>
<tr>
<td>Emil</td>
<td>Tobias</td>
<td>Linus</td>
</tr>
<tr>
<td>16</td>
<td>14</td>
<td>10</td>
</tr>
</table>
O‘zingiz sinab ko‘ring »
Jadvalda istaganingizcha qator bo‘lishi mumkin; faqat har bir qatorda katakchalar soni bir xil bo‘lishiga ishonch hosil qiling.
Eslatma: ba’zan bir qatorda boshqa qatorga qaraganda kamroq yoki ko‘proq katak bo‘lishi mumkin. Bu haqda keyingi boblardan birida bilib olasiz.
Jadval sarlavhalari
Ba’zan katakchalaringizni jadval sarlavha katakchalari bo‘lishini xohlaysiz. Bunday holatlarda
<td> tegi o‘rniga
<th> tegini ishlating:
th
— table header (jadval sarlavhasi) so‘zining qisqartmasi.
Misol
Birinchi qator jadval sarlavha katakchalari bo‘lsin:
<table>
<tr>
<th>Person 1</th>
<th>Person 2</th>
<th>Person
3</th>
</tr>
<tr>
<td>Emil</td>
<td>Tobias</td>
<td>Linus</td>
</tr>
<tr>
<td>16</td>
<td>14</td>
<td>10</td>
</tr>
</table>
O‘zingiz sinab ko‘ring »
Standart bo‘yicha <th> elementlaridagi matn
qalin va markazda joylashgan bo‘ladi, lekin buni CSS bilan o‘zgartirishingiz mumkin.
HTML jadval teglari
| Tag | Tavsif |
|---|---|
| <table> | Jadvalni belgilaydi |
| <th> | Jadvaldagi sarlavha katagini belgilaydi |
| <tr> | Jadvaldagi qatorni belgilaydi |
| <td> | Jadvaldagi katakni belgilaydi |
| <caption> | Jadval sarlavhasini (caption) belgilaydi |
| <colgroup> | Formatlash uchun jadvaldagi bir yoki bir nechta ustunlar guruhini belgilaydi |
| <col> | <colgroup> elementidagi har bir ustun uchun ustun xususiyatlarini belgilaydi |
| <thead> | Jadvaldagi sarlavha (header) kontentini guruhlaydi |
| <tbody> | Jadvaldagi asosiy (body) kontentni guruhlaydi |
| <tfoot> | Jadvaldagi pastki (footer) kontentni guruhlaydi |
Barcha mavjud HTML teglarining to‘liq ro‘yxati uchun HTML teglar ma’lumotnomamizga murojaat qiling.
Video: HTML jadvallari
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!