Pseudo-elemento ::backdrop do CSS

Definição e uso

CSS ::backdrop Os pseudo-elementos são usados para definir o estilo da caixa de visão atrás dos elementos de diálogo ou pop-up.

Exemplo

Exemplo 1

Defina o estilo da caixa de visão atrás do diálogo:

dialog::backdrop {
  background-color: lightgreen;
}

Experimente você mesmo

Exemplo 2

Use gradientes para definir o estilo da caixa de visão atrás do diálogo:

dialog::backdrop {
  background-color: #1fc8db; /* Para navegadores que não suportam gradientes */
  background-image: linear-gradient(140deg, #EADEDB 0%, #BC70A4 50%, #BFD641 75%);
  opacidade:0.75;
}

Experimente você mesmo

Sintaxe do CSS

::backdrop {
  declarações css;
}

Detalhes técnicos

Versão: Módulo de Layout Posicional do CSS Nível 4

Suporte do navegador

Os números na tabela indicam a primeira versão do navegador que suporta completamente o pseudo-elemento.

Chrome Edge Firefox Safari Opera
37 79 47 15.4 24

Páginas relacionadas

Tutorial:Elementos pseudo de CSS