Negrito, itálico e sublinhado com efeito hover

Hooy gente!!! Tudo bem?

A pedido de uma leitora, hoje vou ensinar a deixar o texto negrito, itálico e sublinhado do mesmo jeito que utilizo aqui no blog. O efeito é bem legal e dá uma descontraída no texto. Para ver o tutorial completo é só clicar em leia mais  

  Primeiramente vá no modelo do blog, clique em editar HTML dê um ctrl + F dentro na caixa de códigos e coloque esse trecho: ]]></b:skin>

Achou? Depois coloque o código abaixo ACIMA do código que você pesquisou:

 /*formatação*/

b, strong, bold { color: #87CEFA; -webkit-transition-duration: .80s}

s, strike { color: #DCDCDC; -webkit-transition-duration: .80s}

u, underline { color: #FFD3E3 ; border-bottom: 1px Dashed #CBECFE; text-decoration: none; -webkit-transition-duration: .80s}

i, em, italic { color: #FFD3E3 ; -webkit-transition-duration: .80s}

/*formatação hover*/

b:hover { color: #FFD3E3 ; -webkit-transition-duration: .80s}

s:hover { color: #FF9900 ; -webkit-transition-duration: .80s}

i:hover { color: #FF9900 ; -webkit-transition-duration: .80s}

u:hover { color: #FF9900 ; border-bottom: 1px solid #FF9900 ; text-decoration: none; -webkit-transition-duration: .80s}

Agora é só personalizar do jeito que você quiser =^.^=

♥ b: negrito;
♥ s: tachado;
♥ i: itálico;
♥ u: sublinhado;

Obervação: quando for personalizar a parte do sublinhado, você pode alterar para dashed (pontilhado), dotted (pontinhos) ou solid (linha normal).

Para mudar as cores do efeito normal e hover, você pode consultar essa tabela de cores: clique aqui

Espero que vocês tenham gostado do tutorial 

e se tiver mais algum pedido ou sugestão é só pedir no ask

Deixe sua opinião. Até a próxima!!