♣ Olá meus doces ♣
Hoje trago a vocês mais um dos tutorais de HTML, faz tempo que não faço um post desse não é? Enfim, primeiramente, clique em "Leia Mais" se for usar os efeitos.
Explicarei como é o efeito (pois eu NÃO tenho blog de preview's e também porque não sei fazer .-.), a borda arredondada, é, obviamente, uma borda REDONDA -.-', (zuando pra animar você :D), Opacidade Hover, é isso aqui: A imagem, no "Opacidade." é a imagem normal e a gente passa o mouse por cima e fica um pouco mais clara, já, Opacidade hover, ela já estará clarinha, e então, quando você passar o mouse por cima dela, ela ficara no "modo normal" dela. E eu acabei de explicar detalhadamente o obvio para vocês, porque eu amo muito vocês viu? Tea Lu ama todo mundo :v (sqn), continuando a postagem, vou ensinar vocês a fazer o efeito um separado do outro, e também o dos dois juntos.
Ikuso!
1º Abra o Painel do Blogger, vá no seu blog em Modelo e depois Editar HTML, então, irá aparecer a nossa amada caixinha de códigos, cliquem dentro dela, e depois em Ctrl F ou se preferirem F3, e pesquisem por essa tag:
Explicarei como é o efeito (pois eu NÃO tenho blog de preview's e também porque não sei fazer .-.), a borda arredondada, é, obviamente, uma borda REDONDA -.-', (zuando pra animar você :D), Opacidade Hover, é isso aqui: A imagem, no "Opacidade." é a imagem normal e a gente passa o mouse por cima e fica um pouco mais clara, já, Opacidade hover, ela já estará clarinha, e então, quando você passar o mouse por cima dela, ela ficara no "modo normal" dela. E eu acabei de explicar detalhadamente o obvio para vocês, porque eu amo muito vocês viu? Tea Lu ama todo mundo :v (sqn), continuando a postagem, vou ensinar vocês a fazer o efeito um separado do outro, e também o dos dois juntos.
Ikuso!
1º Abra o Painel do Blogger, vá no seu blog em Modelo e depois Editar HTML, então, irá aparecer a nossa amada caixinha de códigos, cliquem dentro dela, e depois em Ctrl F ou se preferirem F3, e pesquisem por essa tag:
]]>
2º Acima dessa tag, cole o seguinte código (para só o de borda arredondada):
.post img {
-moz-border-radius: 10px;
-webkit-boder-radius: 10px;
border-radius: 10px;
}
2º (tem dois porque você escolhe se quer os efeitos juntos ou não.), se não quiser só o borda arredondada e sim ele e o Opacidade hover, coloque esse código:
.main img {filter:alpha(opacity=82);-moz-opacity:0.82;opacity:0.82;}.main img:hover {filter:alpha(opacity=100);-moz-opacity:1.0;opacity:1.0;duration: 50s;}
3º Visualize o modelo, se estiver tudo certo, salve e aproveite seu efeito ^-^.
Bem gente, foi esse o post, espero ter ajudado vocês, beijos e bye ♥.
Nenhum comentário:
Postar um comentário