HTML <col> Etiketi


Örnek

<colgroup> ve <col> etiketleriyle üç sütunun arka plan rengini ayarlayın:

<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>

Aşağıda daha fazla "Kendiniz Deneyin" örnekleri.


Tanım ve Kullanım

etiketi , bir <colgroup> öğesi <col>içindeki her sütun için sütun özelliklerini belirtir .

<col>etiketi, stilleri her satır için her hücre için tekrarlamak yerine tüm sütunlara uygulamak için kullanışlıdır .


Tarayıcı Desteği

Element
<col> Yes Yes Yes Yes Yes

Öznitellikler

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

Genel Özellikler

Etiket ayrıca HTML'deki Global Nitelikleri<col> de destekler .


Etkinlik Özellikleri

Etiket ayrıca HTML'deki Etkinlik Niteliklerini<col> de destekler .



Daha fazla örnek

Örnek

Tablo sütunlarındaki metni hizalayın (CSS ile):

<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>

Örnek

Tablo sütunlarında metni dikey olarak hizalayın (CSS ile):

<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>

Örnek

Tablo sütunlarının genişliğini belirtin (CSS ile):

<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>

İlgili Sayfalar

HTML DOM referansı: Sütun Nesnesi


Varsayılan CSS Ayarları

Çoğu tarayıcı, <col>öğeyi aşağıdaki varsayılan değerlerle görüntüler:

Örnek

col {
  display: table-column;
}