Mais um efeito que achei muito bacana, dessa vez no leia mais. Dei umas modificadas e espero que gostem!
- Abra seu HTML
- Agora procure ]]></b:skin> acima dele cole o código abaixo
.jump-link {
text-align: right; /* posicionamento do leia mais */
margin-top: 5px; /* espaço que fica entre o leia mais e a postagem */
}
.jump-link a {
padding: 4px; /*acolchoamento entre o fundo e o texto */
color: #8266ae; /* cor do texto */
background: #ded7e4; /* cor do fundo */
font-family: verdana; /* tipo de letra */
font-size: 20px;
border: 1px solid #d1a8fa; /*cor e estilo da borda*/
-moz-border-radius: 6px; /* bordas arredondas */
-webkit-border-radius: 6px; /* bordas arredondas */
border-radius: 6px; /* bordas arredondas */
}
.jump-link a:hover {
padding: 4px; /*acolchoamento entre o fundo e o texto quando passa o mouse */
color: #64319a; /* cor do texto quando passa o mouse*/
background: #d3c3e1; /* cor do fundo quando passa o mouse*/
font-family: verdana; /* tipo de letra quando passa o mouse */
text-decoration: italic; /*decoração do texto quando passa o mouse*/
-moz-border-radius: 6px; /* bordas arredondas */
-webkit-border-radius: 6px; /* bordas arredondas */
border-radius: 6px; /* bordas arredondas */
border-top: 2px solid #ded7e4;
}
Agora salve.

Nenhum comentário:
Postar um comentário