The Moon Reverse ミ✩: Tags em Hover

9 de abril de 2013

Tags em Hover

Olá, meu povo! Tudo certo? Bom gente, acho que vai ser difícil eu me despedir deste layout algum dia de minha vida, fico pensando quando vou mudar e tal, mas é tão difícil, o novo layout já está pronto, mas não estou satisfeita com ele, mas sério, nunca irei me esquecer deste. Enfim, as cores dele serão mais escuras, mas não em tons como preto. Eu irei colocá-lo quando atingirmos a próxima meta ou lá para o dia 25 deste mês, menos se eu acabar antes e de qualquer modo acabar colocando mais cedo do que parece. Certo, agora que minhas explicações acabaram, podemos ver o que é essa "tags em hover". Creditem o menu, minha gente... Preview

01. Procure pela tag  ]]></b:skin>  e acima dela cole o código do quote abaixo:
@font-face { font-family: "silkscreen"; src: url('http://static.tumblr.com/0xqvkot/7jqmgsn0m/pf_arma_five.ttf'); }
.tag {
background:#f1f1f1;
width:50px;
box-shadow: 1px 1px 0px #e6e6e6;
padding:3px;
display: inline-block;
font-family:silkscreen;
font-size: 8px;
margin-left: 1px;
margin-right: 2px;
margin-bottom: 2px;
text-transform: uppercase;
text-align:center;
-webkit-transition-duration: .50s;
}
.tag:hover{
background: #f6f6f6;
box-shadow:1px 1px 0px #e6e6e6;
-webkit-transition-duration: .50s;
}
02. Agora apenas cole o código abaixo em um gadget de html/java.
<div class="tag"><a href="/">nome</a></div>
<div class="tag"><a href="/">nome</a></div>
<div class="tag"><a href="/">nome</a></div>
<div class="tag"><a href="/">nome</a></div>

textsms      21 comentários

  1. Bem Simples é Lindo' ^-^

    Post Novo>> http://worldofthel.blogspot.com.br/

    ResponderExcluir
  2. Oi fofa , eu sou a dona do The Paradise , você comentou no meu blog , que aceitaria trocar afiliação e também disse que eu iria estar afiliada aqui ,quando entra-se eu estaria na sua afiliação mas nao to vejo a minha sigla TP, você já esta afiliada lá ! Beijos :** espero que entenda ! worldcandyy.blogspot.com

    ResponderExcluir
    Respostas
    1. Oh meu Deus, desculpe mesmo Bia, estava completamente esquecida só pode T.T
      Irei colocá-la agora mesmo.
      Desculpe ²

      Beijos <33

      Excluir
  3. Very lindo.
    Muito útil esse tutorial.
    Tenha um bom dia,flor.
    Bjs
    www.garotaousada.com

    ResponderExcluir
  4. Ain sério, vc irá fazer um novo layout? aa irei ficar com saudades desse T_T

    Muito super o tutorial o resultado fica perfeito de fofo

    Adolescente Nerd

    ResponderExcluir
    Respostas
    1. TT.TT Também sentirei saudades, ele foi tipo o mais importante na história dos layouts do blog.
      E obrigada Hannah <3

      Excluir
  5. Layout lindo demais ;3

    Adorei o tutorial, fica tão lindo o efeito (:
    Conheci seu blog agora, gostei muito do conteúdo ^^ Queria saber se você aceita afiliação?

    Bjos :*

    ResponderExcluir
    Respostas
    1. *UUU* Obrigada mesmo ~
      Claro que aceitaria, vi seu blog achei tão lindo apesar de começar agora, gostei do seu blog <333
      Já colocarei na elite *uu*

      Excluir
    2. Obrigada *-*
      Já coloquei seu blog na elite também ;3

      Excluir
  6. Adoro esse efeito, fica super fofo!
    beijos
    Purple Star

    ResponderExcluir
  7. Não tá funcionando, eu queria usar na elite de afiliados :(

    http://henriquemontoya.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. :// Aqui está tudo nos conformes, tem certeza que verificou os códigos que há antes de você colocar o deste efeito ?

      Excluir
  8. O meu n funcionou :'(

    ResponderExcluir

O blog não é mais atualizado com novas postagens. Mas fique à vontade para perguntar algo do seu interesse, seja relacionado às postagens ou dúvidas que lhe inquietam, estou algumas vezes entrando no blog e certamente verei se tiver comentários pendentes. Obrigada pela visita, leitor!

Este blog não é mais atualizado com novas postagens!
Ps.: Que saudade, cara... Alguém ainda vivo por aqui em 2020?