CSS/Selektoren/backdrop

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche
Browserunterstützung
caniuse.com

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
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

  • Pseudoelemente

    Elemente nur mit CSS erzeugen

    •  ::after, ::before
    •  ::backdrop
      und mehr …
     
  • 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

CSS-Selektoren

Abgerufen am 2.09.2025
von "http://wiki.selfhtml.org/wiki/CSS/Selektoren/backdrop"