21 abril, 2012

Dica de Site Útil : CSS Border Radius + Tutorial : como aplicar o CSS Border Radius nas imagens do blog em efeito hover





Um site muito bom, onde você pode editar as bordas das imagens. Entre http://border-radius.com/

Como eu disse, este site ajuda a você editar bordas, por exemplo, vc quer um efeito folhinha na imagem, é só você pega o lado direito >, parte de cima e colocar 100 e em baixo 0, e do lado esquerdo < e em cima colocar 0 e embaixo 100, pegue o código e cole no html da imagem.
Exemplo : (Clique para ampliar)



Tutorial :

Exemplo de resultado :


Tutorial achado no blog Sweet Poison.
Vá em Design > Editar HTML > Dê CTRL + F e pesquise por :

]]></b:skin>

E acima desta tag cole o código abaixo :


.main img {
AQUI COLOQUE O CÓDIGO QUANDO O MOUSE NÃO ESTIVER EM CIMA DA IMAGEM }
.main img:hover {
AQUI COLOQUE O CÓDIGO DEPOIS QUE O MOUSE ESTIVER EM CIMA DA IMAGEM }

Como eu disse, para pegar o código do efeito entre no site , faça o efeito que quiser, pegue o código e cole no lugar do código onde está em negrito.
(CASO NÃO DER CERTO, NÃO RECLAME, EU TESTEI E DEU)
Espero que tenham gostado e beijos.

6 comentários:

  1. Te repassei um selinho:

    http://feitadepurpurina.blogspot.com.br/2012/04/1-selinho-do-blog.html

    Beijoos!

    ResponderExcluir
  2. OH GOSH! Que legal! *-*
    www.justdebee.blogspot.com

    ResponderExcluir
  3. Obrigada pela dica!

    Bjs;
    http://nevandoem-londres.blogspot.com.br/

    ResponderExcluir
  4. Nossa que lindo *-*
    Com certeza vou usar no meu próximo lay c:

    http://princesswithallstar.blogspot.com.br/

    ResponderExcluir
  5. Ai que legal! Estava querendo mesmo saber desse. Muito bom amei o tuto. bjs linda

    eternosonhooficial.blogspot.com

    ResponderExcluir
  6. ótimo site!! Entrei lá um pouquinho e adorei :)
    Bjss,
    www.blogdagiu1.blogspot.com.br

    ResponderExcluir