Übersicht

Der pseudo-Klassen Selektor :empty wählt Elemente aus, die über kein Kindelement verfügen. Ein Inhalt in Form von einem Text wird dabei ebenfalls als ein Kind des Elementes angesehen, Kommentare und sonstige Verarbeitungsanweisungen jedoch nicht.

Syntax

<element>:empty { /* Deklarationsblock */ }

Beispiele

span:empty::before  {
  background-color: lime;
}

Die ersten beiden span Elemente sind leer, sodass der :empty Selektor angewendet wird. Auf die letzten drei trifft das jedoch nicht zu.

<span></span> 
<span><!-- Dieses Element wird grün dargestellt --></span>

<span> </span>
<span>Lorem ipsum</span>
<span><strong></strong></span>

Spezifikationen

Spezifikation Status Kommentar
Selectors Level 4
Die Definition von ':empty' in dieser Spezifikation.
Arbeitsentwurf Keine Änderung
Selectors Level 3
Die Definition von ':empty' in dieser Spezifikation.
Empfehlung Ursprüngliche Definition

Browser Kompatibilität

Wir konvertieren die Kompatibilitätsdaten in ein maschinenlesbares JSON Format. Diese Kompatibilitätstabelle liegt noch im alten Format vor, denn die darin enthaltenen Daten wurden noch nicht konvertiert. Finde heraus wie du helfen kannst!

Merkmal Chrome Firefox (Gecko) Internet Explorer Opera Safari
Grundlegende Unterstützung 1.0 1.0 (1.7 oder früher) 9.0 9.5 3.1
Merkmal Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Grundlegende Unterstützung 2.1 1.0 (1) 9.5 10.0 3.1

Schlagwörter des Dokuments und Mitwirkende

Mitwirkende an dieser Seite: Sebastianz, Strongground, fscholz, SJW, Michael2402
Zuletzt aktualisiert von: Sebastianz,