empty-cells Özelliği

empty-cells özelliği, tarayıcıya HTML tablosundaki boş td veya th hücrelerinin arka planını ve kenarlığını nasıl göstereceğini belirtir: gösterecek mi yoksa göstermeyecek mi.

Bir hücre aşağıdaki durumlarda boş kabul edilir: hiçbir karakter yoksa, hücrede yalnızca boşluk (bir veya daha fazla), satır sonu veya sekme karakteri varsa, ya da visibility özelliği hidden olarak ayarlanmışsa.

Bir hücreyi boş olmayan ancak aynı zamanda görünür metin olmadan yapmak için şu yöntem kullanılır: hücreye bölünemez bir boşluk   yazılır.

Eğer border-collapse özelliği collapse değerine ayarlanmışsa, bu özellik çalışmaz.

Sözdizimi

cssseçici {
  empty-cells: show | hide;
}

Değerler

Değer Açıklama
show Boş hücre için arka plan ve kenarlık gösterilir.
hide Boş hücre için arka plan ve kenarlık gösterilmez.

Varsayılan değer: show.

Örnek . show Değeri

Şu anda tabloda bazı hücreler boş, ancak yine de bir kenarlığa ve arka plana sahipler:

html<table>
  <tr>
    <td>hücre</td>
    <td></td>
    <td>hücre</td>
  </tr>
  <tr>
    <td></td>
    <td>hücre</td>
    <td></td>
  </tr>
  <tr>
    <td>hücre</td>
    <td>hücre</td>
    <td>hücre</td>
  </tr>
</table>
csstable {
  width: 400px;
  empty-cells: show;
}
td {
  border: 1px solid black;
  background-color: #f3f3f3;
  text-align: center;
}

Результат:

Örnek . hide Değeri

Şimdi ise boş hücrelerin arka planı ve kenarlığı olmayacak:

html<table>
  <tr>
    <td>hücre</td>
    <td></td>
    <td>hücre</td>
  </tr>
  <tr>
    <td></td>
    <td>hücre</td>
    <td></td>
  </tr>
  <tr>
    <td>hücre</td>
    <td>hücre</td>
    <td>hücre</td>
  </tr>
</table>
csstable {
  width: 400px;
  empty-cells: hide;
}
td {
  border: 1px solid black;
  background-color: #f3f3f3;
  text-align: center;
}

Результат:

Ayrıca Bakınız

  • boş bir öğenin nasıl görüneceğini belirleyen empty sözde sınıfı