terça-feira, 17 de abril de 2012

CSS3 Box Shadow

Box Shadow é uma nova propriedade do CSS3 que serve para adicionar sombra a um elemento de caixa (Box Shadow). Cuidado com adição dessa feature em áreas muito grandes, você pode ter problemas de performance. Polyfills são desnecessários para o uso dessa feature, pois aumentão o custo de uso e pioram a performance. Não é mais necessário usar prefixos (-webkit- , -moz- , etc ...) Os valores do Box Shadow são:


box-shadow: hoffset voffset blur spread color inset

          hoffset: offset horizontal. Valor positivo coloca a sombra a direita. Valor negativo coloca a sombra a esquerda.

          voffset: offset vertical. Valor positivo coloca a sombra abaixo do elemento. Valor negativo coloca a sombra acima do elemento.

          blur (opcional) : indica o alcance da "mancha" (tradução livre). Quando maior o valor, maior a "mancha".

          color (opcional): indica a cor da sombra

          inset (opcional) : A inserção da sombra é feita dentro do elemento.

* Caso você queira adicionar mais de uma sombra ao elemento, coloque vírgula separando as duas sombras.

No site abaixo você irá encontrar 3 exemplos

http://dabblet.com/gist/2407270


Nenhum comentário:

Postar um comentário