Otra forma de poner la letra capital

Desde que publiqué la plantilla Quo Template me han preguntado cómo he hecho para poner la letra capital a todos los títulos de las entradas pero específicamente cómo puede hacerse para poner la letra capital al inicio de cada entrada.

Anteriormente habíamos visto una manera de poner la letra capital en las entradas usando un poco de CSS y con ayuda de un pequeño código en las entradas que se desee que aparezca la letra capital.

Con esa otra forma el proceso es más simple, pues con sólo un cambio de agregará a todas las entradas de forma automática.

Lo único que hay que hacer es agregar el pseudo-elemento first-letter que hará que tome la primera letra del texto y le aplique los estilos que hayamos elegido.

Para realizarlo sólo entra en Diseño | Edición de HTML y antes de ]]></b:skin> agrega lo siguiente:

.post-body:first-letter {
font-size: 40px;
color: #0B243B;
padding-right: 2px;
}

A partir de ahí ya aparecerá la letra capital en todas las entradas, pero también puedes agregar otros estilos a la letra, tales como el tipo de fuente, grosor, etc.

Estos son algunos otros atributos que puedes agregar:

font-weight: bold; /* letra en negrita */
font-family: Arial; /* tipo de letra */
font-style: italic; /* letra cursiva */

El procedimiento es muy sencillo y se puede aplicar a muchas áreas, por ejemplo:

Si quieres que los comentarios también tengan letra capital agrega esto:

.comment-body:first-letter {
font-size: 40px;
color: #0B243B;
padding-right: 2px;
}

Si quieres que el título de las entradas tenga letra capital agrega esto:

.post h3 a:first-letter {
font-size: 40px;
color: #0B243B;
padding-right: 2px;
}

Si quieres que el título del blog tenga letra capital agrega esto:

#header h1:first-letter {
font-size: 40px;
color: #0B243B;
padding-right: 2px;
}

Si quieres que los bloques entrecomillados tengan letra capital agrega esto:

.post-body blockquote:first-letter {
font-size: 40px;
color: #0B243B;
padding-right: 2px;
}

Consideraciones finales:

1. Funciona en todos los navegadores.
2. Si hubiera una imagen antes del texto entonces no se mostrará la letra capital.
3. Si la letra capital tuviera un signo antes o después de ella estas también se verán afectadas con los estilos.