Pseudo-klassen empty
Pseudo-klassen empty anger hur ett
tomt element (som inte innehåller text) ska se ut.
Syntax
selector:empty {
}
Exempel
I detta exempel är den sista li tom,
men kommer fortfarande att ha en markör:
<ul>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li></li>
</ul>
:
Exempel
Låt oss ändra beteendet för den tomma li-taggen:
<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;
}
:
Exempel
Dölj de tomma li helt:
<ul>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li>list item</li>
<li></li>
</ul>
li:empty {
display: none;
}
:
Se även
-
egenskapen
empty-cells,
som talar om för webbläsaren hur den ska visa bakgrund och kantlinje för tomma tabellceller