CSS/Selektoren/backdrop
Aus SELFHTML-Wiki
CSS | Selektoren(Weitergeleitet von Backdrop)
Der ::backdrop-Selektor kann dazu verwendet werden, um einen Hintergrund zu erstellen, der das dahinterliegende Dokument für ein Element im Stack des Top-Layers versteckt. Das ::backdrop-Pseudoelement liegt zwischen dem obersten Element, z. B: einer Dialog-Box, und den anderen Elementen im Hintergrund.
Syntax | ::backdrop
|
---|---|
Browsersupport | Details: caniuse.com |
Beispiel
dialog::backdrop {
background: rgb(0 0 0 / 0.5);
}
Das hinter dem backdrop liegende Dokument wird durch eine schwarze, halb durchscheinende Maske verdeckt.
Siehe auch
- z-index und Stapelkontext
Top Layer > z-index: 100.000
- modale Dialogfenster
- dialog-Element
- modal vs nichtmodal
- :backdrop
Das UI-Element für Web-Apps
- Fullscreen-Ansicht
(Bild mit Lightbox-Effekt)
Weblinks
- WHATWG: Fullscreen API: ::backdrop
- MDN: ::backdrop
- caniuse: CSS selector: ::backdrop
Liste der CSS-Selektoren
- einfache Selektoren
- Universalselektor
- ID-Selektor
- Klassenselektor
- Typselektor
- Attributselektoren
- Kombinatoren
- Pseudoelemente
- Pseudoklassen