Pseudo-class empty
Pseudo-class empty menentukan tampilan
elemen yang kosong (tidak berisi teks).
Sintaksis
selector:empty {
}
Contoh
Dalam contoh ini, li terakhir kosong,
tetapi tetap akan memiliki penanda:
<ul>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li></li>
</ul>
:
Contoh
Mari ubah perilaku untuk tag li yang kosong:
<ul>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li></li>
</ul>
li:empty {
border: 1px solid blue;
list-style-type: circle;
color: blue;
width: 100px;
}
:
Contoh
Sembunyikan li kosong sepenuhnya:
<ul>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li></li>
</ul>
li:empty {
display: none;
}
:
Lihat juga
-
properti
empty-cells,
yang memberi tahu browser cara menampilkan latar belakang dan border sel tabel yang kosong
