Novo blog: http://h-tmland.blogspot.com.br/
Espero que não fiquem chateados por eu ter mudado de url, foi apenas para mudar o layout e o nome ainda não ficar Black, se eu tivesse que mudar, ficaria meio estranho o layout branco e verde e o nome estar Black ainda. Por isso mudei :)
Créditos a GNMH também pelo tutorial de colocar um theme de tumblr no blogger.

-->

Tutorial: Negrito, itálico, sublinhado e riscado personalizado com hover


Saudações, amoras! Como vão? Sei que é a quarta ou a terceira vez que eu digito isso hoje, mas né? Essa é a última por hoje hahaha. Ah, meu povo, eu sinto uma saudade do meu gatinho! Ele fugiu de casa para namorar, sabe como é animal, daí ninguém mais viu ele, mas se tivessem visto ele fugindo também, iam fazer o quê? O bichinho é livre, não podíamos prendê-lo em casa. Mas de qualquer forma, sinto muitas saudades dele.

Mas nessa postagem não vamos falar do meu gato, vamos falar um porquito da postagem de hoje. Mais um tutorial pra hoje e o último (pra hoje), nesse tutorial vou ensinar como personalizar o negrito, itálico, sublinhado e riscado, é bem fácil também. Bom, pra quem não tá entendendo o que é hover e personalizado, olhem o do meu blog que vocês vão ver como é, ele muda de cor e também é personalizado. Bom, para quem quiser, eu fiz a versão sem hover também, daí vocês que decidem! Vamos láaaa!!! Créditos (www)

1- Vá em TemaEditar HTMLDê F3 e procure por ]]></b:skin>
depois, cole acima desse trecho o seguinte código:

COM HOVER
b{color: #DA70D6; text-decoration: none;-webkit-transition-duration: .40s; } /* Estilo do negrito */ b:hover {color: #DA70D6; text-decoration: none;-webkit-transition-duration: .40s; } /* Estilo hover do negrito */ i {color: #63B8FF; text-decoration: none; -webkit-transition-duration: .40s;} /* Estilo do itálico */ i:hover {color: #63B8FF; text-decoration: none; -webkit-transition-duration: .40s;} /* Estilo hover do itálico */ u {color: #1C1C1C; text-decoration: none; border-bottom: 1px dashed #7CFC00; -webkit-transition-duration: .40s;} /* Estilo do sublinhado */ u:hover {color: #1C1C1C; text-decoration: none; border-bottom: 1px dashed #7CFC00; -webkit-transition-duration: .40s;} /* Estilo hover do sublinhado */ strike {color: #009900; text-decoration: strike; -webkit-transition-duration: .40s; } /*estilo do riscado */ strike:hover {color: #FF00FF; text-decoration: strike; -webkit-transition-duration: .40s; } /*estilo hover do riscado */
Modifique o que está sublinhado e salve, sei que está uma bagunça, mas eu acho que dá pra entender um pouco. 

SEM HOVER
b{color: #DA70D6; text-decoration: none;} /* Estilo do negrito */ i {color: #63B8FF; text-decoration: none;} /* Estilo do itálico */ u {color: #1C1C1C; text-decoration: none; border-bottom: 1px dashed #7CFC00;} /* Estilo do sublinhado */ strike {color: #009900 ; text-decoration: strike; } /*estilo do riscado */
Faça o mesmo do hover, modifique o que está em sublinhado, visualize e salve!

Foi isso, amoras com cobertura de chocolate! Espero que tenham gostado desse tutorial.

Um beijo e um cheiro

Nenhum comentário:

Postar um comentário