50 Seguidores + Tutorial Efeito Caption


Yoo Minna,tudo bom?Hoje vim trazer um Tutorial pra vocês chamado Efeito Caption(Aquele Efeito que tem na "Equipe" do blog,então não vou colocar o Preview)
*Crédito ao blog Kawaii World*
Ah!E queria agradecer pelos 50 Seguidores,muito obrigada mesmo,eu agradeço muito (:
(vocês já devem saber que eu não sou boa com discurso né?e.e')
Para ver o Tutorial clique em Leia Mais (:
1.Vá em Editar HTML e procure por ]]></b:skin>.Acima dessa Tag cole esse código:
@font-face {font-family: "04b03"; src: url('http://static.tumblr.com/qbzesex/2tSm7y7gy/04b_03_.ttf'); format("truetype");}
imagem {display: block; position: relative; float: left; overflow: hidden; margin: 0 2px 2px 0;}
captioon {position: absolute; background: #000; color: #fff; padding: 3px 25%; opacity: 0; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -o-transition: all 0.6s ease; text-align: center; line-height: 10px; font-size: 8px; font-family: "04b03", small-fonts; text-shadow: 1px 1px 3px #000;}
imagem:hover captioon {opacity: 0.75;}
imagem:hover:before {opacity: 0;}
.caption:before {bottom: 10px; right: 10px;}
.caption captioon {bottom: 3px; right: 30%;}
.caption:hover captioon {right: 0px;}
2.Crie um GadGet de HTML/JavaScript e cole esse código:
<imagem class="caption">
<img src="LINK DA IMAGEM" />
<captioon>Legenda Aqui</captioon></imagem>
Espero que tenham gostado do Tutorial (:
Kissu >.<

4 comentários:

  1. Adorei o tuto, assim que meu blog tiver mais postadoras vou usá-lo!
    http://diariodemeninas2s2lovedays.blogspot.com.br

    ResponderExcluir
  2. olá.. amei seu blog.. em breve voce ganhara um sellinho no meu blog.. espero que goste.. blogjuliamonteiro.blogpsot.com.br

    ResponderExcluir

Fique a vontade para comentar,só peço que siga essas regrinhas:

-Não ofenda ninguém
-Não fale palavrões
-Não fale sobre sexo ou poste coisas do tipo
-Lemos todos os comentários e tentamos responder
-Se não gostou do que diz na postagem,não usem palavras ofensivas
-Não é proibido por o link do seu blog nos comentários,se gostar dele irei seguir
-Todos os comentários são moderados

Aqui alguns "emoticons" para você usarem:

(^_^) (^_^)v (^v^) *(^O^)* (^▽^) (⌒▽⌒) (^o^) (^v^) (^w^) (・∀・)w(^o^)W (^o^)y (*^▽^*) \(*O*)/ (*O*) (*-*) (♥_♥) (n///n) (^///^) (#^.^#) (♥///♥) (#*.*#) (ToT) (T_T) (;O;) (Y_Y) (T▽T) (;_;) (!__!) (/_\) (u_u) (U_U) (>_<) (* ̄m ̄) ( ̄へ ̄) ( ̄~ ̄; ) (¬_¬) (¬_¬") (>xO<) (>.<) ( ̄ー ̄) (ーー;) ∑(O_O;) (@_@) (O_O) (o_O) (p_q) (.O.') (o_o) ('_') (?_?) ('O') (ô_ô) (.-.) (OwO) ( ̄□ ̄;) ( ゚ Д゚) (゜◇゜)((+_+)) [( - - )] (-__-) (X_X) (=_=) (-__-) ( L_____L ) ~zzz (-.-)zzzzz (#_#) (x_X) (z_z) (xOx) m(_ _)m (^_^)/~~ (ToT)/~~~ (;_;)/~~~ (=^・ω・^=) (=^_^=) (☞゚∀゚)☞ (ノ◕ヮ◕)ノ*:・゚ (〜 ̄△ ̄)〜 ╭◉␣◉╮ (ノ◕ω◕)ノ ◕ ◡ ◕