Az empty pszeudoosztály

Az empty pszeudoosztály meghatározza, hogyan fog kinézni egy üres elem (amely nem tartalmaz szöveget).

Szintaxis

cssszelektor:empty {
  
}

Példa

Ebben a példában az utolsó li üres, de mégis lesz jelölője:

html<ul>
  <li>listaelem</li>
  <li>listaelem</li>
  <li>listaelem</li>
  <li>listaelem</li>
  <li></li>
</ul>

Результат:

Példa

Változtassuk meg a viselkedést az üres li elemek esetén:

html<ul>
  <li>listaelem</li>
  <li>listaelem</li>
  <li>listaelem</li>
  <li>listaelem</li>
  <li></li>
</ul>

cssli:empty {
  border: 1px solid blue;
  list-style-type: circle;
  color: blue;
  width: 100px;
}

Результат:

Példa

Rejtsük el teljesen az üres li elemeket:

html<ul>
  <li>listaelem</li>
  <li>listaelem</li>
  <li>listaelem</li>
  <li>listaelem</li>
  <li></li>
</ul>

cssli:empty {
  display: none;
}

Результат:

Lásd még