Primera letra capital en la entradas del blog



Cambiar la letra inicial del texto, la primera letra o letra capital dando una apariencia distinta ya que es el encargado de captar la atención de los lectores del blog, además este método es usado frecuentemente en revistas o boletines.

Es un procedimiento sencillo que permitirá mostrar la letra capital de la entrada como del contenido del artículo con un estilo distinto, pudiendo escoger su color, tamaño, estilo, tipo de fuente, etc.

Lo mejor es que este método es automático, por lo que una vez que apliques el truco, tu letra se mostrará en todas las entradas, evitando el procedimiento antiguo que involucraba el tener que utilizar un código para mostrar la letra capital entrada por entrada.

Ver en Blog de Prueba


Para aplicarlo en tu blog de blogger ir a:


Plantilla ►Personalizar ►Diseñador de Plantillas ► Avanzado ► Añadir Código CSS Personalizado

En el recuadro pegar el siguiente Código:
.post-body:first-letter {
font-size:28px;
color:#007cbb;
font-style: italic;
}

►Para finalizar Aplicar al blog.


Para aplicar al titulo del post 


.post h3 a:first-letter {
font-size:28px;
color:#666666;
font-style: italic;
}

Para personalizar Entradas populares


.popular-posts :first-letter {
font-size:28px;
color:#007cbb;
font-style: italic;
}

Dando estilo a la letra inicial de cada Entrada Popular.


✒ Los valores que pueden editarse para cambiar el aspecto.


• font-size: el tamaño de la letra, reemplazando 28px por un valor mayor o menor.
• color: el color de la letra (ver tabla de colores).
• font-style: italic; la letra aparecerá en cursiva puedes cambiarlo por font-style: normal;o font-style: oblique;
→Se puede agregar una fuente de texto distinta en cada caso añadiendo por ejemplo:
• font-familyCourier New ;

Agrega esta línea antes de la llave de cierre (}).
• Courier New: representa el nombre de la fuente. Otros: Comic Sans MS; o Arial, Trebuchet MS, Times New Roman...





Si te gusta la entrada compártela.

¡Gracias!

Publicar un comentario
▬ Antes de comentar recuerda:▬
► No se permite spam.
► No permitimos un vocabulario inapropiado.
► Se se lo más especifico posible.

►Para convertir tu comentario en HTML puedes utilizar algunos códigos:
- Si deseas incluir un enlace utiliza este código:<a href="URL de la Pagina">Titulo del enlace</a>
- Para introducir un código, utilice la etiqueta <i rel="pre"> AQUÍ TU CÓDIGO ... </i>
- Para insertar una imagen, utilice la etiqueta <i rel="image"> SU URL IMAGEN AQUÍ ... </i>
- Para insertar un título, utilice la etiqueta <b rel="h3"> SU TÍTULO AQUÍ ... </b>
- Para insertar una nota, utilice la etiqueta <b rel="quote"> NOTA QUE AQUÍ ... </b>
- Para insertar texto en negrita, utilice la etiqueta <b> SU TEXTO AQUÍ ... </b>
- Para insertar texto en cursiva, utilice esta etiqueta<i> SU TEXTO AQUÍ ... </i>

No olvides suscribirte para recibir las actualizaciones

Back to Top