23 de nov de 2012

Marcadores em hover

Boa noite, desculpe meu chá de sumiço rs. Até que em fim alguém lembrou que a ask do blog existe e pediu um tutorial fiquei bem feliz kk. Essa pessoinha super gentil me pediu pra postar um tutorial de como deixar os marcadores do blog igual o meu. Então seu pedido é uma ordem. Eu lembro que aprendi esse tuto lá no Camila's Designs então créditos pra ela.
Primeiro vocês tem que deixar os marcadores com a opção "Cloud" Ativada como nesta imagem.
Agora abra seu HTML e procure por ]]></b:skin> recomendo usar a opção CTRL+F .
Antes da tag procurada cole o seguinte código.
.label-size span, .label-size a {
color: #000000; /* cor dos marcadores em estado normal */
padding:2px 5px; /* espaço entre os marcadores e as margens, não altere */
margin:2px; /* espaço entre um marcador e outro, não altere */
background: #EEEEEE; /* cor de fundo dos marcadores */
display:inline-block; /* deixa os marcadores em caixinhas, não altere */
font-size:10px; /* tamanho da fonte */
border-radius:10px; /* bordas arredondadas retire se não quiser*/
}
.label-size span, .label-size a:hover {
background: #000000; /* cor de fundo dos marcadores em estado hover */
color: #EEEEEE; /* cor dos marcadores em estado hover */
}
Agora personalize como quiser, mas não altere os códigos display, margin e padding. 
Ficará mais ou menos parecido com o meu . 
Se tiverem alguma dúvida comente.
_Guuh

9 comentários:

  1. Ahh que legal! ótimo tuto, bem explicado!
    Beijos,
    Sim Senhorita (Clique no perfil)

    ResponderExcluir
  2. não vou usar :( o histórico do blog fica do mesmo jeito, mais é muito legal esse efeito nos marcadores (Y)

    ResponderExcluir
  3. Amei o tutu super fofo!
    diamonts-arent-forever.blogspot.com

    Beijos

    ResponderExcluir
  4. Eu ja tinho visto esse tutorial antes, muito útil
    seguindo seu blog liindo, segue?
    sentierodellerose1.blogspot.com
    beijos

    ResponderExcluir