• - ChapStique -

    - ChapStique -

  • - Crouton -

    - Crouton -

  • - Nadaddy -

    - Nadaddy -

  • - Fatty -

    - Fatty -

  • - Hollywood -

    - Hollywood -

2 de junho de 2013

Formatação hover em Fade

Nosso primeiro tutorial desde que troquei o layout!
Olá manjus!
Estou aqui só de passagem pois hoje não passarei o dia em casa, mas se eu fizer essa postagem rapidinho acho que dá hehe
Estou feliz pois agora a Hannah G3 está vendo também Another (www), hoje ela viu o segundo episódio, o que é ótimo para quem não tem tempo por causa das provas né :3

- A Shiory Chan do blog (www) pediu por formulário um tutorial de sublinhado, itálico, negrito e tachado hover em fade, aqui está um exemplo para quem não sabe qual é o efeito. Peguei de meu blog testes.
Vamos lá?!
Clique na setinha e acima de ]]></b:skin> cole:

 /*formatação*/
b, strong, bold { color: #ff6eb4; -webkit-transition-duration: .80s}
s, strike { color: #ee1289; -webkit-transition-duration: .80s}
u, underline { color: #00c5cd ; border-bottom: 1px dashed #ff6eb4; text-decoration: none; -webkit-transition-duration: .80s}
i, em, italic { color: #00ced1 ; -webkit-transition-duration: .80s}
/*formatação hover*/
b:hover { color: #cd6090 ; -webkit-transition-duration: .80s}
s:hover { color: #FFA500 ; -webkit-transition-duration: .80s}
i:hover { color: #FF69B4 ; -webkit-transition-duration: .80s}u:hover { color: #ff6eb4 ; border-bottom: 1px dotted #00c5cd ; text-decoration: none; -webkit-transition-duration: .80s}
Troque as cores em negrito, se quiser podem se guiar por essa tabela (www).
Podes trocar também o dashed para solid ou dotted.
Espero que tenham gostado do tutorial, é simples mais dá um toque a mais no blog ^^'

23 comentários:

  1. Eu acho que fica muito fofo o negrito, italico e sublinhado personalizado. E que bom que ta vendo Another, quando acabar, te recomendo a ver Mirai Nikki, Elfen Lied e Shiki. Meus favoritos! Beijos :3

    ResponderExcluir
    Respostas
    1. rsrs, esses animes não fazem meu tipo, prefiro, K-on, hyouka, e outros hahaha

      Excluir
  2. Oi megan vc poderia fazer um tutu ensinando a colocar esse fundo azul apenas nas postagens ? igual o seu

    ResponderExcluir
  3. O tutorial é bem básico mas é sempre bom ter arquivado no blog. Há sempre novatos andando por aí, além de dar um efeito super profissional. bezzo, sarah
    http://agd-doce.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Verdade, tutoriais simples como esse que fazem um blog ficar mais profissional :3

      Excluir
  4. Another *----* é um dos meus preferidos hahaha >.<
    Gostei odo tuto, muito útil :)
    bj
    sorrisomet4lico.blogspot
    copyof-me.blogspot

    ResponderExcluir
    Respostas
    1. É, ótimo né?! Como pode um anime tão bom assim ushaush'

      Excluir
  5. Eu acho bem mais fofo o negrito, itálico, sublihado e riscado com hover, dá um toque mais cute no blog >u<
    Falando nisso, amei o lay novo *u*
    Beijoos!

    Caramelos Encantados

    ResponderExcluir
    Respostas
    1. Ah valeu fofa! acho que com efeito fade fica muito mais in love ~ rsrs, mais aqueles sem hover também ficam fofos né.

      Excluir
  6. Fica tão fofo, acho que vou aplicar >3< Amei o novo layout, super criativo!

    Beijos ~
    garotas-cupcakes

    ResponderExcluir
  7. Yo, então fico feliz que a Hannah esteja assistindo Another, ela vai gostar é muito! Sobre o tutorial, ele é mega bom, é fácil de se colocar, eu já uso. Kisus.

    Kuusou World

    ResponderExcluir
    Respostas
    1. é verdade né, para mim só falta o último ep. e a ova ;)

      Excluir
  8. O efeito é muito bom, eu acho que fica linda no blog *_____*
    Eu fico muito feliz por pedir afiliação com o HTML Thing porque eu quero *^*
    ~Chu

    ResponderExcluir
  9. Nossa que simples era só adicionar o ''tempo'' no tuto *-* mas que simpleza de tuto!

    XOXO :D
    jovenclube(.blogspot.com.br)

    ResponderExcluir
  10. Ótimo tutorial, gostei muito !
    um abraço,
    cr4zy-world.blogspot.com

    ResponderExcluir
  11. Own! Que blog tão fofo, gostei do tutorial! Tava procurando, haha'. Beijos lindona, até mais...
    www.lincymods.blogspot.com

    ResponderExcluir
  12. É bastante útil e deixa um efeito fofo demais >2<
    Flor já te coloquei na minha elite,eu tinha sem querer apagado a minha antiga elite e acabei esquecendo o nome e a url de alguns blogs.Mas o AN já está de volta!

    Beijos,
    Welcome March

    ResponderExcluir