Skip to content

12-box-shadow.md

Latest commit

 

History

History
31 lines (18 loc) · 928 Bytes

12-box-shadow.md

File metadata and controls

31 lines (18 loc) · 928 Bytes

Box Shadow

A propriedade box-shadow é utilizado para adicionar efeitos de sombra em volta de um elemento. Você pode especificar mais de um efeito, separando-os com vírgulas. Uma box-shadow é descrita pelo deslocamentos (offset) X e Y em relação ao elemento, desfoco, propagação do raio e cor.

Sintaxe

div {
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}

Onde:

  • O primeiro valor 2px equivale ao eixo x da pagina offset-x.

  • O segundo valor 2px equivale ao eixo y da pagina offset-y.

  • O terceiro valor 2px equivale ao blur, que a sombra vai ter blur-radius.

  • E o ultimo atributo rgba(0, 0, 0, 0.2) é a cor que essa sombra vai receber color.

O Box-shadow generator é uma ferramenta interativa que permite a criação de box-shadow.


Próxima página → Transições