[Tutoriales] Personalizar el estilo del texto de las entradas

Estoy deseando tener el Syndicateeeeee >///////<

Holiiii!!!! Ayer no pude publicar ya que estuve bastante ocupada entre el entrenamiento de Karate y una exhibición de Karate de mi instituto (>////////<), así que no pude ni tocar el ordenador. Lo bueno es que ya hoy terminé mi último exámen, y de los tres días que me quedan de clases, uno es un festival de villancicos, y otro el ensayo general del mismo, así que no me quedan muchos días de levantarse a las siete de la mañana :'D Gracias a dios. Pero bueno, vamos con el tutorial. Hoy les traigo creo que es bastante útil para l@s blogger@s que estén empezando, para darle un aspecto más bonito a su blog. Sin embargo, no me refiero a el aspecto exterior, sino a el texto de las entradas, ya que hay ciertas cosas que no las puedes hacer en el diseñador de plantillas. Además, para aprender a utilizarlas en textos html u otros, puedes visitar ESTA entrada.

Negrita, cursiva, subrayado y tachado

Bien, para editar estos estilos, lo primero es ir a Plantillas>Editar HTML y buscamos ]]></b:skin>, y justo antes, pegamos los siguientes códigos:

b {
color: #AE3030;
-webkit-transition:all 0.5s ease-in-out;
-moz-transition: all 0.5s eade-in-out;
}
b:hover {
color: rgb(249, 224, 224);
-webkit-transition:all 0.5s ease-in-out;
-moz-transition: all 0.5s eade-in-out;
}
i {
color: green;
-webkit-transition:all 0.5s ease-in-out;
-moz-transition: all 0.5s eade-in-out;
}
i:hover {
color: lightgreen;
-webkit-transition:all 0.5s ease-in-out;
-moz-transition: all 0.5s eade-in-out;
}
u {
color: rgb(249, 114, 92);
-webkit-transition:all 0.5s ease-in-out;
-moz-transition: all 0.5s eade-in-out;
}
u:hover {
color: rgb(253, 179, 1);
-webkit-transition:all 0.5s ease-in-out;
-moz-transition: all 0.5s eade-in-out;
}
strike {
color: gray;
-webkit-transition:all 0.5s ease-in-out;
-moz-transition: all 0.5s eade-in-out;
}
strike:hover {
color: black;
text-decoration:none;
-webkit-transition:all 0.5s ease-in-out;
-moz-transition: all 0.5s eade-in-out;
}

Una vez lo copiemos, cambiamos lo que está en rojo, los colores, por los que nosotros preferamos utilizando estos de AQUÍ. La b es la negrita, la i es la cursiva, la u es el subrayado, el strike es el tachado, y los que tienen :hover detrás, es cuando el ratón pasa por encima, por ejemplo, b:hover, es cuando pasas el ratón por encima de algo en negrita.

Lo que está en naranja, lo cambiamos por line-through si queremos que cuando el ratón pase por encima del tachado, se quede tachado. Si queremos que cuando pase el ratón por encima, se puedan ver las letras sin tacharse, lo dejamos como está, con el none.

Links

Bueno, esto pueden editarlo desde el Diseñador de plantillas, pero lo que no pueden cambiar desde allí, es la opción de que los links no estén subrayados cuando pasas el ratón por encima. Es muy fácil. Seguimos en Editar HTML, y buscamos (Ctrl+F) a:hover {

Una vez lo encontremos, debajo pegamos lo siguiente:

text-decoration:none;

Y listo!! Fácil verdad?

Y bueno, esto ha sido todo por ahora, pero seguramente el domingo o la próxima semana, vuelva con una entrada que continúe a esta, ya que aunque ahora se me ocurren tres o cuatro cosas más, ya son cosas complicadillas, y tengo que ver algunas cosas para asegurarme de que lo haga bien. Además, no tengo mucho tiempo más para escribir xD

Beshus y hasta mañana!!