Universalselektoren
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Juli 2015 browserübergreifend verfügbar.
Der CSS-Universalselektor (*) erfasst Elemente jedes Typs.
/* Selects all elements */
* {
color: green;
}
Der Universalselektor ist ein spezieller Typselektor und kann daher bei Verwendung von @namespace mit einem Namespace versehen werden. Das ist nützlich bei Dokumenten mit mehreren Namespaces, etwa HTML mit eingebettetem SVG oder MathML oder XML, das mehrere Vokabulare kombiniert.
ns|*– erfasst alle Elemente im Namespace ns*|*– erfasst alle Elemente|*– erfasst alle Elemente ohne deklarierten Namespace
Hinweis:
Der Universalselektor (*) erfasst nur Elemente.
Er erfasst für sich genommen keine Pseudoelemente direkt.
Um beispielsweise alle ::before-Pseudoelemente auf einer Seite zu erfassen, müssen Sie einen Selektor wie *::before verwenden. Das funktioniert, weil * alle Elemente erfasst und das Pseudoelement ::before für alle Elemente verfügbar ist.
Syntax
* { style properties }
Bei einfachen Selektoren ist das Sternchen optional. Beispielsweise sind *.warning und .warning gleichwertig.
Beispiele
HTML
<p class="warning">
<span lang="en-us">A green span</span> in a red paragraph.
</p>
<p id="maincontent" lang="en-gb">
<span class="warning">A red span</span> in a green paragraph.
</p>
CSS
* [lang^="en"] {
color: green;
}
*.warning {
color: red;
}
*#maincontent {
border: 1px solid blue;
}
.floating {
float: left;
}
/* automatically clear the next sibling after a floating element */
.floating + * {
clear: left;
}
Ergebnis
Namespaces
In diesem Beispiel erfasst der Selektor nur Elemente im Beispiel-Namespace.
@namespace example url("http://www.example.com/");
example|* {
color: blue;
}
Spezifikationen
| Spezifikation |
|---|
| Selectors Level 4 # the-universal-selector |