Teg thead

Teg thead jadvalning yuqori qismini belgilaydi. Qatorlarni shunday guruhlash uchun ishlatiladiki, darhol ma'lum bir guruhga CSS uslublarini qo‘llash mumkin. Bitta jadvalda faqat bitta thead tegi bo‘lishi mumkin.

Teg thead ko‘pincha tbody va tfoot teglari bilan birgalikda HTML jadvalining yuqori qismi, asosiy qismi va pastki qismini belgilash uchun ishlatiladi.

Misol

Keling, thead tegi bilan birlashtirilgan qatorlar guruhiga color xususiyati yordamida matnning qizil rangini qo‘shamiz:

html<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>Surn</th>
      <th>Salary</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>name1</td>
      <td>surn1</td>
      <td>200$</td>
    </tr>
    <tr>
      <td>name2</td>
      <td>surn2</td>
      <td>1000$</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td>count: 2</td>
      <td>-</td>
      <td>total: 1200$</td>
    </tr>
  </tfoot>
</table>

cssthead {
  color: red;
}

table, td, th {
  border: 1px solid black;
}

Результат:

Misol

Bu erda esa thead yuqorida emas, tfoot pastda emas, shunga qaramasdan brauzer ularni o‘z o‘rniga qo‘yadi:

html<table>
  <tfoot>
    <tr>
      <td>count: 2</td>
      <td>-</td>
      <td>total: 1200$</td>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>name1</td>
      <td>surn1</td>
      <td>200$</td>
    </tr>
    <tr>
      <td>name2</td>
      <td>surn2</td>
      <td>1000$</td>
    </tr>
  </tbody>
  <thead>
    <tr>
      <th>Name</th>
      <th>Surn</th>
      <th>Salary</th>
    </tr>
  </thead>
</table>

csstable, td, th {
  border: 1px solid black;
}

Результат:

Shuningdek qarang