Hola de nuevo amigos, ya tenía un buen tiempo sin actualizar el Blog, la razón, es porque estuve un tiempo sin internet, y cuando por fin lo volví a tener, tenía muchas cosas que hacer, pero ya estoy de regreso, que es lo importante, y con mejor contenido.

Ejemplo de Blockquote

En este tutorial les voy a enseñar a personalizar los “blockquotes“, tal vez muchos no conozcan lo que esto es, pero es algo importante para tu blog, un ejemplo es si tienes un blog donde hablas de Libros a veces tienes que citar parte de esos libros, y con esta etiqueta se hace, con blockquote pero no se ve nada bien si solo ponemos la etiqueta, así que le pondremos estilos, y es lo que les enseñare a hacer en este tutorial, así que empecemos.

Primero que nada, se tienen que ir a Blogger > Plantilla > Edición HTML, ya ahí buscan “]]></b:skin>” y justo arriba de esa linea agregan lo siguiente:

.post-body blockquote {
width: 500px; /*Ancho*/
background: rgb(216, 216, 216); /*Color de fondo*/
color: #000; /*Color del texto*/
font-family: sans-serif; /*Tipo de fuente*/
font-size: 15px; /*Tamaño de la fuente*/
padding: 10px; /*Margenes hacía adentro.*/
border: 1px solid #9E9E9E; /* Tamaño, estilo y color del borde*/
font-style: italic; /*Estilo de la fuente*/
}

Hasta ahora se verá así:

Blockquote con CSS

Y eso sería algo básico, pero podemos agregar un bonito efecto al poner el cursor encima también con css, esto lo hacemos usando :hover de css, el código sería así:

.post-body blockquote:hover {
background: rgb(236, 236, 236); /*Color de fondo*/
border: 1px solid #CACACA; /*Color del borde*/
transition: .3s; /*Duración de la transición*/
}

Y cuando pongamos el cursor encima de ese blockquote, se verá así:

Blockquote hover
Como ven hay un pequeño cambio, que es sólo el color de fondo y el borde, pero ustedes pueden agregar cualquier otra cosa que quieran, cómo cambiar el tamaño, color y estilo de fuente, tamaño del blockquote, y mucho más.
Y pues eso sería todo en este tutorial, tal vez lo vean muy básico, pero apenas regresé después de un largo tiempo, y es lo que pude hacer, pero con los días mejorarán los trucos y tutoriales para sus blogs.