Trago um tutorial muito simples porém muito útil, ele e perfeito para diferenciar os autores do blog dos comentarias. Esse tutorial deixa uma imagem ou icone marcando que você e o autor do blog, assim faciliando dos seus leitores saberem que é você, evitando aquelas pessoas se passarem por moderador no blog.
.comments .comments-content .icon.blog-author
Códigos
.comments .comments-content .icon.blog-author { background-repeat: no-repeat;background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAALEgAACxIB0t1+/AAAAAd0SU1FB9sLFwMeCjjhcOMAAAD+SURBVDjLtZSvTgNBEIe/WRRnm3U8RC1neQdsm1zSBIU9VVF1FkUguQQsD9ITmD7ECZIJSE4OZo9stoVjC/zc7ky+zH9hXwVwDpTAWWLrgS3QAe8AZgaAJI5zYAmc8r0G4AHYHQKVwII8PZrZFsBFkeRCABYiMh9BRUhnSkPTNCtVXYXURi1FpBDgArj8QU1eVXUzfnjv7yP7kwu1mYrkWlU33vs1QNu2qU8pwN0UpKoqokjWwCztrMuBhEhmh8bD5UDqur75asbcX0BGUB9/HAMB+r32hznJgXy2v0sGLBcyAJ1EK3LFcbo1s91JeLwAbwGYu7TP/3ZGfnXYPgAVNngtqatUNgAAAABJRU5ErkJggg==);
}
}
Códigos
.comments .comments-content .icon.blog-author{
position:absolute;
top: -2px;
right: 160px;
margin:0;
background-image: url(SUA IMAGEM);width:32px;height:36px
}
position:absolute;
top: -2px;
right: 160px;
margin:0;
background-image: url(SUA IMAGEM);width:32px;height:36px
}
Onde esta top e right você muda a posição do seu ícone. Vá modificando nos números até achar a posição que te agradar. Mude "Sua imagem" com os px exatamente iguais no que estao widht e height coloque a largura e altura. Créditos de KW.
Aceita afiliação?
ResponderExcluirhttp://kawaii-little-things.blogspot.com.br/
Yo aceito sim, você ja esta na minha coluna
ExcluirVou por vcs na elite :) *--* obrigada por ter ido la no KT
ExcluirCerto, nao foi nada ^^
ExcluirOlá ^^ Amei o seu blog, e utilizei alguns tutoriais para fazer remodelações ao meu layout ^^ Queria perguntar uma coisa, como se faz aquele menu como você tem, aquele que aparece no topo da página quando se passa o mouse? Se já escreveste o tutorial, peço desculpa por estar a incomodar, mas é que eu não encontro /:
ResponderExcluirObrigado ^^
Asia Looks For You
Que legal! Tenho certeza que deve estar ficando lindo, esse menu se encontra nesse site: http://lovers-of-designs.tumblr.com/post/55434307410/olha-outro-tutorial-de-menu-fofinho-pra-voces
Excluir