Pseudoklasse empty
Die Pseudoklasse empty legt fest, wie ein
leeres Element (das keinen Text enthält) aussieht.
Syntax
Selektor:empty {
}
Beispiel
In diesem Beispiel ist das letzte li leer,
hat aber dennoch einen Aufzählungspunkt:
<ul>
<li>Listenelement</li>
<li>Listenelement</li>
<li>Listenelement</li>
<li>Listenelement</li>
<li></li>
</ul>
:
Beispiel
Ändern wir das Verhalten für das leere li-Tag:
<ul>
<li>Listenelement</li>
<li>Listenelement</li>
<li>Listenelement</li>
<li>Listenelement</li>
<li></li>
</ul>
li:empty {
border: 1px solid blue;
list-style-type: circle;
color: blue;
width: 100px;
}
:
Beispiel
Verstecken wir leere li komplett:
<ul>
<li>Listenelement</li>
<li>Listenelement</li>
<li>Listenelement</li>
<li>Listenelement</li>
<li></li>
</ul>
li:empty {
display: none;
}
:
Siehe auch
-
die Eigenschaft
empty-cells,
die dem Browser mitteilt, wie der Hintergrund und der Rahmen leerer Tabellenzellen angezeigt werden sollen
