Letra capital con CSS

Desde hace algún tiempo quería poner algunas citas (o frases celebres) en el blog. Pero un post de unas dos lineas (a lo sumo tres) no quedaba visualmente demasiado bien, pero poniendo la primera letra como una letra capital, la cosa mejora mucho.

Tan solo son necesarias unas lineas de CSS y una class específica para las citas en cuestión:

1
2
3
4
5
6

.cita:first-letter {
    font-size: 3em;
    line-height: 0.9em;
    float: left;
    margin: .1em;
    }

.cita, selecciona los párrafos con class=”cita” que pueda haber en la página, esto junto con el first-letter lo que hace es seleccionar la primera letra de dichos párrafos para aplicar las propiedades CSS necesarias.

El resultado puedes verlo en los dos post anteriores .