Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Micilini Roll

Efeito sombreado de borda

Recommended Posts

pessoal observem este site abaixo,vemos que ele apresenta uma borda arredondada de 1px e nesta borda tem uma especie de efeito de sombreado,eu sei que este site é so uma imagem mais eu sei que da pra fazer isso pelo css como:

 

link do site:

 

file:///C:/Users/William/Desktop/SUMMA%20-%20Marketing%20+%20Branding%20+%20Advertising%20+%20Design%20+%20Web.htm

Compartilhar este post


Link para o post
Compartilhar em outros sites

A sombra pode ser feita utilizando a propriedade box-shadow do CSS3. Um exemplo da utilização:

HTML

<div id="container">
Conteúdo
</div>

CSS

#container {
/* formatação do box */
width:500px;
background:#f6f6f6;
border-radius:5px;
padding:10px;
    
/* box shadow */
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.5);
}

Como pode ver na linha 9, é bem simples de implementar. Resultado: http://jsfiddle.net/FJ9zN/
Caso ainda não saiba como funciona os valores da propriedade, estude através do CSS3 Generator, em "Box Shadow".

:seta: http://www.css3.info/preview/box-shadow/

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.