Blogger news

domingo, 12 de junho de 2011

Como criar botões com CSS

Use os 3 controles deslizantes para escolher o tamanho e profundidade do botão.
Embaixo, escolha as cores da seguinte maneira:
  • Top Gradient Color: cor do topo em gradiente
  • Bottom gradiente color: cor de baixo em gradiente
  • Top Border Color: cor da borda do topo
  • Hover background color: cor do fundo ao passar o mouse
  • Text Color: cor do texto
  • Hover Text Color: cor do texto ao passar o mouse
  • Active background color: cor de fundo ao clicar no botão
Depois que o botão estiver pronto, clique sobre ele e copie o código.



Entre no painel do Blogger, clique em design>editar HTML. Faça um backup do template e cole o código antes da tag ]]></b:skin> (use o Crtl+F do teclado para encontrá-la). Substitua o ponto (.) que está antes de cada palavra “button” por jogo da velha (#). Ficará assim:  #button. Visualize e salve.
Em “elementos de página”, clique em adicionar gadget HTML/javascript.



Cole este código:
<div id="button>ESCREVA AQUI O TEXTO</div>
Escreva, no local indicado, o texto que deverá aparecer no botão. Se quiser colocar um link, use este outro código:
<div id="button"><a href=”LINK”>TEXTO</a></div>
Pronto! Agora seu blog já tem um botão feito apenas com CSS ;)
Veja, na imagem abaixo, um botão que criei para o DB ( é o azul):

Existem outros sites para criar botões personalizados em CSS:

0 comentários:

Postar um comentário

Map

Related Posts Plugin for WordPress, Blogger...