MohirDox

Ko'rinishi

HTML Jadval O'lchamlari ​

HTML jadvallari har bir ustun, qator yoki butun jadval uchun turli o'lchamlarga ega bo'lishi mumkin.

Jadval O'lchamlariga Misollar ​

   
   
   
   
   
   
   
   

Jadval, qator yoki ustun o'lchamini belgilash uchun style atributidan va width yoki height xossalaridan foydalaning.

HTML Jadval Kengligi ​

Jadval kengligini belgilash uchun <table> elementiga style atributini qo'shing:

Misol: Jadval kengligini 100% ga o'rnatish

html
<table style="width:100%">
  <tr>
    <th>Ism</th>
    <th>Familiya</th>
    <th>Yosh</th>
  </tr>
  <tr>
    <td>Otabek</td>
    <td>Karimov</td>
    <td>25</td>
  </tr>
  <tr>
    <td>Gulnoza</td>
    <td>Jalilova</td>
    <td>30</td>
  </tr>
</table>

TIP

Kenglik uchun foiz birligini ishlatish, elementning o'zidan yuqori darajadagi elementga nisbatan qanchalik keng bo'lishini bildiradi. Bu holatda, yuqori darajadagi element <body> hisoblanadi.

HTML Jadval Ustun Kengligi ​

   
   
   

Muayyan ustun o'lchamini belgilash uchun <th> yoki <td> elementiga style atributini qo'shing:

Misol: Birinchi ustun kengligini 70% ga o'rnatish

html
<table style="width:100%">
  <tr>
    <th style="width:70%">Ism</th>
    <th>Familiya</th>
    <th>Yosh</th>
  </tr>
  <tr>
    <td>Otabek</td>
    <td>Karimov</td>
    <td>25</td>
  </tr>
  <tr>
    <td>Gulnoza</td>
    <td>Jalilova</td>
    <td>30</td>
  </tr>
</table>

HTML Jadval Qator Balandligi ​

   
   
   

Muayyan qator balandligini belgilash uchun qator elementiga style atributini qo'shing:

Misol: Ikkinchi qator balandligini 200 pikselga o'rnatish

html
<table style="width:100%">
  <tr>
    <th>Ism</th>
    <th>Familiya</th>
    <th>Yosh</th>
  </tr>
  <tr style="height:200px">
    <td>Otabek</td>
    <td>Karimov</td>
    <td>25</td>
  </tr>
  <tr>
    <td>Gulnoza</td>
    <td>Jalilova</td>
    <td>30</td>
  </tr>
</table>

Bu hujjatda HTML jadval o'lchamlarini o'zgartirish usullari, ustun va qator o'lchamlarini belgilash, hamda amaliy misollar keltirilgan. Jadval tuzishda o'lchamlarni moslashtirish orqali sahifani foydalanuvchi uchun qulay va chiroyli ko'rinishga keltirish mumkin.