HTML značka <col>


Příklad

Nastavte barvu pozadí tří sloupců pomocí značek <colgroup> a <col>:

<table>
  <colgroup>
    <col span="2" style="background-color:red">
    <col style="background-color:yellow">
  </colgroup>
  <tr>
    <th>ISBN</th>
    <th>Title</th>
    <th>Price</th>
  </tr>
  <tr>
    <td>3476896</td>
    <td>My first HTML</td>
    <td>$53</td>
  </tr>
</table>

Další příklady „Vyzkoušejte si to sami“ níže.


Definice a použití

Značka <col>určuje vlastnosti sloupce pro každý sloupec v prvku <colgroup> .

Značka <col>je užitečná pro použití stylů na celé sloupce, namísto opakování stylů pro každou buňku, pro každý řádek.


Podpora prohlížeče

Element
<col> Yes Yes Yes Yes Yes

Atributy

Attribute Value Description
span number Specifies the number of columns a <col> element should span

Globální atributy

Značka <col>také podporuje globální atributy v HTML .


Atributy události

Značka <col>také podporuje atributy událostí v HTML .



Další příklady

Příklad

Zarovnat text ve sloupcích tabulky (pomocí CSS):

<table style="width:100%">
  <tr>
    <th>ISBN</th>
    <th>Title</th>
    <th>Price</th>
  </tr>
  <tr>
    <td>3476896</td>
    <td>My first HTML</td>
    <td style="text-align:right">$53</td>
  </tr>
  <tr>
    <td>2489604</td>
    <td>My first CSS</td>
    <td style="text-align:right">$47</td>
  </tr>
</table>

Příklad

Svislé zarovnání textu ve sloupcích tabulky (s CSS):

<table style="height:200px">
  <tr>
    <th>Month</th>
    <th style="vertical-align:bottom">Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td style="vertical-align:bottom">$100</td>
  </tr>
</table>

Příklad

Zadejte šířku sloupců tabulky (pomocí CSS):

<table>
  <tr>
    <th style="width:130px">Month</th>
    <th style="width:80px">Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
  <tr>
    <td>February</td>
    <td>$80</td>
  </tr>
</table>

Související stránky

HTML DOM reference: Column Object


Výchozí nastavení CSS

Většina prohlížečů zobrazí <col>prvek s následujícími výchozími hodnotami:

Příklad

col {
  display: table-column;
}