CSS ::backdrop Pseudo-Element

Definition und Verwendung

CSS ::backdrop Pseudo-Elemente werden verwendet, um den Stil des Hintergrundrahmens hinter Dialog- oder Pop-up-Elementen zu setzen.

Beispiel

Beispiel 1

Stellen Sie den Stil des Hintergrundrahmens hinter dem Dialog ein:

dialog::backdrop {
  Hintergrundfarbe: lightgreen;
}

Versuchen Sie es selbst!

Beispiel 2

Stellen Sie den Stil des Hintergrundrahmens hinter dem Dialog ein, indem Sie Verläufe verwenden:

dialog::backdrop {
  Hintergrundfarbe: #1fc8db; /* Für Browser, die keine Verläufe unterstützen */
  Hintergrundbild: linear-gradient(140deg, #EADEDB 0%, #BC70A4 50%, #BFD641 75%);
  Durchsichtigkeit: 0.75;
}

Versuchen Sie es selbst!

CSS-Syntax

::backdrop {
  css-Anweisungen;
}

Technische Details

Version: CSS Positioned Layout Module Level 4

Browser-Unterstützung

Die Zahlen in der Tabelle geben die erste Browser-Version an, die den Pseudo-Element vollständig unterstützt.

Chrome Edge Firefox Safari Opera
37 79 47 15.4 24

Verwandte Seiten

Tutorium:CSS Pseudo-Elemente