Fórum dos Blogs
Bem vindo ao suporte Criarumblog.com
Seja bem vindo ao suporte oficial do serviço Criarumblog ! Aqui, você vai aprender os melhores truques para seu blog, e também sobre às demais funções do seu Blog!

Contribua e participe do fórum.
Recuperação de senha

Nota: use se tiver perdido acesso administrativo.

Login

Esqueci minha senha

Últimos assuntos
Quem está conectado
17 usuários online :: Nenhum usuário registrado, Nenhum Invisível e 17 Visitantes :: 2 Motores de busca

Nenhum

[ Ver toda a lista ]


O recorde de usuários online foi de 469 em 26/3/2010, 14:52

[TUTORIAL] Adicionar sombra ao quadro dos artigos

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

[TUTORIAL] Adicionar sombra ao quadro dos artigos

Mensagem por Zen em 25/1/2012, 20:07



Adicionar sombra no quadro dos artigos



Para dar um efeito realistico no blog nós vamos adicionar um pequeno código CSS no que resultará em algo interessante. Vamos adicionar sombra ao quadro dos artigos de seu blog fazendo com que o mesmo ganhe destaque imprescionante!


--> FAQ'S e Tutoriais <--
Adicionar sombra no quadro dos artigos



- Edição expert com CSS:
Para que seja possível que o efeito torne-se real precisamos conhecer a função que vamos usar.

Painel de controle ->> Multiblog ->> Tema personalizado ->>

(carregue na imagem para aumentar)


Agora vamos adicionar o código CSS para modificar o que desejamos.

- Código CSS e opção para modificar:
A variável ".post" indentifica o local em que será aplicado o efeito CSS.
.post {
border: 1px solid #98469B;
-moz-box-shadow: 0px 0px 10px #CCCCCC;
-webkit-box-shadow: 0px 0px 10px #CCCCCC;
}
Preto: Cor da borda do quadro dos artigos.
Ciano: Irá definir a quantidade da borda do quadro dos artigos.
Vermelho -> Irá definir a posição da sombra entre o lado direito ou esquerdo da página. Se o valor for positivo, será para a direita. Caso o valor seja negativo, será para a esquerda. Quanto maior for o valor, mais irá se expandir a sombra.
Laranja -> Irá definir a posição da sombra entre o lado de cima ou o lado de baixo da página. Se o valor for positivo, será para baixo. Caso o valor seja negativo, será para cima. Quanto maior for o valor, mais irá se expandir a sombra.
Violeta -> Esta valor representa a cor hexadecimal da borda.
Verde -> Pode modificar a qualidade da sombra. Quanto maior for o valor, mais spray ela ficará. Para que consiga compreender melhor, veja estas duas imagens, a primeira mostra quando o valor é zero e a segundo mostra como fica quando vamos aumentando:


Perguntas frequentes

  • Existe outras variáveis para adicionar efeitos nas mensagens?
    ".post .content, .post .date" é uma das classes do termo de mensagem. Caso você queira usar os mesmos efeitos em outro local no blog, basta substituir o valor .post pela variável desejada.

  • Não sei geirr um CSS. E agora?
    Você poderá consultar mais informações no tutorial de elaboração de um CSS: Elaborar um CSS.





© Suporte do Criarumblog



Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
[Dúvida] Adicionar sombra ao quadro dos artigos

Zen
Assistente prossional
Assistente prossional

Masculino
Número de Mensagens: 391
Localização: No fórum dos blogs!
Emprego/lazer: Voluntário do Forumactif
Humor: Faço que gosto, para quem eu gosto que no caso é para você!
Pontos: 6027
Reputação: 8
Data de inscrição: 19/03/2010

http://shiftactive.blogspot.com

Voltar ao Topo Ir em baixo

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo


Permissão deste fórum:
Você não pode responder aos tópicos neste fórum