19.1.14

Negrito, Itálico, Tachado e Sublinhado

Oiii galera, hoje eu trouxe um tutorial bem fácil e básico. Ensinarei a vocês hoje a como personalizar o negrito, itálico, sublinhado e tachado. É bem fácil, e acho que é essencial para todos os blogs. Vamos aprender?


Vá em sem HTML, procure por ]]></b:skin> e acima cole o seguinte código


/***Negrito***/b, strong, bold { color: #CORDAFONTE;background: #CORDOFUNDO /***retire essa linha se não quiser***/ -webkit-transition-duration: .80s}/***Tachado***/s, strike {  color: #CORDAFONTE;background: #CORDOFUNDO /***retire essa linha se não quiser***/ -webkit-transition-duration: .80s}/***Sublinhado***/u, underline {  color: #CORDAFONTE;background: #CORDOFUNDO /***retire essa linha se não quiser***/ border-bottom: 1px solid  #CORDABORDA; text-decoration: none; -webkit-transition-duration: .80s}/***Itálico***/i, em, italic {  color: #CORDAFONTE;background: #CORDOFUNDO /***retire essa linha se não quiser***/ -webkit-transition-duration: .80s}/***Tudo em Hover***//***Negrito***/b:hover {  color: #CORDAFONTE;background: #CORDOFUNDO /***retire essa linha se não quiser***/ -webkit-transition-duration: .80s}/***Tachado***/s:hover { color: #CORDAFONTE;background: #CORDOFUNDO /***retire essa linha se não quiser***/ -webkit-transition-duration: .80s}/***Sublinhado***/u:hover { color: #CORDAFONTE;background: #CORDOFUNDO /***retire essa linha se não quiser***/ border-bottom: 1px dashed #CORDABORDA; text-decoration: none; -webkit-transition-duration: .80s}/***Itálico***/i:hover {  color: #CORDAFONTE;background: #CORDOFUNDO /***retire essa linha se não quiser***/ -webkit-transition-duration: .80s}

Bom, tá tudo explicadinho no código, basta seguir o que está falando lá. Ah, se você quiser colocar um cursor personalizado, basta acrescentar cursor: NOMEDOCURSOR; A seguir tem os nomes de cursores


default (seta)crosshair (cruz)e-resize (seta que aponta à direita)hand;(mão)help; (sinal de pergunta)move; (cruz com setas nas extremidades)n-resize; (seta que aponta para cima)ne-resize; (seta que aponta ao nordeste)nw-resize; (seta que aponta ao noroeste)s-resize; (seta que aponta para baixo)se-resize; (seta que aponta para o sudeste)sw-resize; (seta que aponta para o sudoeste)w-resize; (seta que aponta à esquerda)
É isso babys, espero que tenham gostado e até o próximo post ;*

Créditos www 

Nenhum comentário:

Postar um comentário