Oiiiee Escritoras e.eTudo bem com vocês ?? Eu estou muito desanimada, pois dia 03/02 começam as minhas aulas...
Mas, eu vim postar um tutorial que a May do Black Dream, me pediu na nossa página F.A.Q.
O tutorial é pra deixar as bordinhas em hover, que nem o daqui. E pra quem não sabe o que é hover, irei explicar, é quando você passa o mouse em algo colorido e ele muda de cor.
Ex. Passe o mouse
Agora você já sabe onde clicar !!
Vamos ao tutorial:
Bordas na área da postagem
Vá em Editar HTML, aperte Ctrl + F e procure por /* Posts e abaixo daquele pontilhado cole:
.post-outer {
background:#fff;
border-top: 2px solid #cor;
border-bottom: 2px solid #cor;
padding: 2px;
margin-top: 2px;
margin-bottom:20px;
box-shadow: 0 0 2px #000;
-webkit-transition-duration: .60s;
}
.post-outer:hover {
border-top: 2px solid #cor;
border-bottom: 2px solid #cor;
box-shadow: 0 0 1px #000;
-webkit-transition-duration: .60s;
}
Agora vamos modificar do seu jeito. Mude aonde está escrito #cor , para a cor desejada. Aonde está escrito hover , é a cor que será mostrada ao passar o mouse. Então mude o que está escrito #cor abaixo de hover, para por a barrinha em hover.
Se você não quiser as sombras mude os números de vermelho 2 e 1 pra 0. Se quiser por as sombras, mude o #000, para a cor desejada.
Bordas na sidebar
Vá em Editar HTML, aperte Ctrl + F e procure por /* Widgets e abaixo daquele pontilhado cole:
.sidebar .widget {
background:#fff;
border-top: 2px solid #cor;
border-bottom: 2px solid #cor;
padding: 5px;
margin-left: -30px;
margin-top: 0px;
margin-bottom:20px;
border-radius:0px;
box-shadow: 0 0 4px #000;
-webkit-transition-duration: .60s;
}
.sidebar .widget:hover {
border-top: 2px solid #cor;
border-bottom: 2px solid #cor;
box-shadow: 0 0 2px #000;
-webkit-transition-duration: .60s;
}
Agora vamos modificar do mesmo jeito. Mude aonde está escrito #cor , para a cor desejada. Aonde está escrito hover , é a cor que será mostrada ao passar o mouse. Então mude o que está escrito #cor abaixo de hover, para por a barrinha em hover.
Se você não quiser as sombras mude os números de vermelho 2 e 1 pra 0. Se quiser por as sombras, mude o #000, para a cor desejada.
Créditos pelo tutorial: Assim Tipo Tudo e One Dí Things.
Espero que tenham entendido e gostado do tutorial. É um pouco demoradinho mais o resultado fica lindo. Aconselho você á usar no modelo Travel. Nele esse tuto dá 100% certo.
Fiquem com Deus...B-bjuuxx e até a próxima !!
Xièxiè ♥
ResponderExcluirBjs♥May
Black Dream «
De nada, flor ♥
Excluir(lol agora que descobri que XiéXié eh obrigada...mds, que burrice a minha -_-)
B-bjs