HTML таг col

Пример

Кратък пример как се използва тагът <col>.

<table class="table table-bordered text-center">
  <colgroup>
    <col span="1" style="background-color:#f8d7da;">
    <col span="1" style="background-color:#d1e7dd;">
    <col span="1" style="background-color:#cff4fc;">
  </colgroup>
  <thead class="table-light">
    <tr>
      <th>Име</th>
      <th>Роля</th>
      <th>Екип</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Мария</td>
      <td>Разработчик</td>
      <td>Backend</td>
    </tr>
    <tr>
      <td>Иван</td>
      <td>Дизайнер</td>
      <td>UI/UX</td>
    </tr>
  </tbody>
</table>

Дефиниция и употреба

Тагът <col> се използва вътре в елемента <colgroup>, за да дефинира една или повече колони в HTML таблица. Чрез него могат да се прилагат стилове или общи атрибути към цели колони, вместо към отделни клетки (<td> / <th>).

Всеки <col> отговаря на една или повече последователни колони в таблицата. Обикновено се използва за:

• задаване на ширина на колони (чрез CSS, напр. style="width:150px;" или класове);
• задаване на фонов цвят, рамки или други визуални стилове за цяла колона;
• групиране на няколко колони с еднакви стилове чрез атрибута span.

Елементът <col> е празен (self-closing) – няма съдържание и не съдържа други елементи. Той трябва да бъде поставен непосредствено след отварящия таг <table>, в рамките на <colgroup>, преди <thead>, <tbody> или редовете <tr>.

Browser Support

Browser	Поддръжка
Chrome	✔️
Firefox	✔️
Edge	✔️
Safari	✔️
Opera	✔️

Атрибути