
Faíscas! *-*
Sabe esse efeito no welcome?? Que Mexe pro lado e pro outro? Achou? Pois é, aprendi ele num tutorial lá na cidade do If I Ruled The World é super fácil e dá outra cara ao blog.
Let's go?
]]></b:skin>Acima do que você achou cole isso:
.atub{background: #F9F9F9; /*Cor do fundo*/font-family: century gothic; /*Fonte*/ font-size: 11px; /*Tamanho da fonte*/ margin: 2px;color: #000; /*Cor da fonte*/ display: block;-moz-box-shadow: inset 5px 0 0px 0 #FFB3B3; /*Cor da barrinha do lado*/ -webkit-box-shadow: inset 5px 0 0px 0 #FFB3B3; /*Cor da barrinha do lado*/ box-shadow: inset 3px 0 0px 0 #FFB3B3; /*Cor da barrinha do lado*/ padding: 3px 3px 3px 6px;-moz-transition: all 1.1s ease-out; /*Tempo*/ -webkit-transition: all 1.1s ease-out; /*Tempo*/ -o-transition: all 1.1s ease-out; /*Tempo*/ -ms-transition: all 1.1s ease-out; /*Tempo*/ transition: all 1.1s ease-out;} /*Tempo*/ .atub:hover{color: #fff;-moz-box-shadow: inset 550px 0 0px 0 #FF7676; /*Cor do fundo a hover*/ -webkit-box-shadow: inset 550px 0 0px 0 #FF7676; /*Cor do fundo a hover*/ box-shadow: inset 550px 0 0px 0 #FF7676; /*Cor do fundo a hover*/ color: #000;} /*Cor da fonte a hover*/Modifique o que está em negrito e salve! :3
Agora, vá em um gadjet HTML/Javascript e cole isso:
<div class="atub">SEU TEXTO AQUI</div>
Pronto! 
Nenhum comentário:
Postar um comentário