01/05/2013

Tutorial: Borda nos gadgets

Dithingers rs! 
Hoje eu trouxe um tutorial de colocar aquelas bordinha em baixo do gadget com certeza vocês já devem ter visto, aqui no blog tem essas bordinhas, azuis e tal. 
Bom qualquer coisa pra quem não sabe vão saber o que é apenas clicando em leia mais



Bom é bem simples não tem problema e dificuldade nenhuma super fácil, vou tentar explicar o máximo de detalhe que puder. 

Em "Editar HTML" aperte Ctrl + F do seu teclado e procura pela tag:
.sidebar .widget {
E antes de fechar a chave } você cola:
border-bottom: 5px tipodaborda #cordaborda;
Explicando:
Border-Bottom: Bottom significa se a linha vai ficar em cima ou embaixo, se for embaixo você deixa como Bottom mas se for em cima você troca por "Top"
5px: O tamanho da sua linha, mais grossa você aumenta o numero, mais fina você diminui.
Tipo da Borda: Tipo de borda, vou mostrar os tipos de borda e você só precisa colocar o nome do tipo da borda.
Cor da borda: Obvio!


  • Tipos de bordas: 
Nome: Solid 


Nome: Dotted


Nome: Double


Nome: Dashed 


Nome: Ridge



Espero que gostem e se tiverem alguma duvida é só perguntar no ASK do blog que eu irei ajudar. 
Beijos. 
Até mais!

4 comentários:

  1. Pra mim só existia borda solid, dashed e dotted. Não sabia das outras -p Gostei do tutorial, simples e fácil.

    >> little--dream.blogspot.com

    ResponderExcluir
  2. Este comentário foi removido pelo autor.

    ResponderExcluir
  3. nao acho b*order-bottom: 03px solid #ffa3c*7 no novo templante =/

    ResponderExcluir
  4. Adorei as bordas, ficaram lindas no meu Layout novo! >< Ha e eu fiz um post mais dei os créditos ao seu blog, se quiser pode olhar >< Já estou seguindo,segue de volta?
    http://m--diario.blogspot.com.br/

    ResponderExcluir