Cómo poner texto en cursiva

HTML y CSS nos ofrecen la posibilidad de poner el texto en cursiva. Me refiero a textos como este. Cubramos todo lo que necesitas saber.

¿Qué es el texto en cursiva y por qué debería ponerlo en cursiva?

La mayoría de las veces pone el texto en cursiva para llamar la atención. Literalmente, para enfatizar una palabra, de modo que alguien que lea la oración le dé a esa palabra o frase un toque extra, como usted podría pretender como escritor. O podría ser seguir una guía de estilo particular, como poner en cursiva el título de algo, por ejemplo, un artículo publicado.

Usa la emetiqueta

El “em” emsignifica literalmente énfasis. Los navegadores, de forma predeterminada, pondrán en cursiva el texto envuelto en emetiquetas HTML.

p  That was a emwonderful/em party, Bebe./p

Imagine el sonido de esa oración, donde el lector enfatiza esa palabra, dándole a la oración una sensación diferente que si no lo hiciera.

Usa la ietiqueta

El ielemento consiste en aplicar cursiva al texto sin que implique énfasis. Se trata de diferenciar visualmente un texto de otro sin implicar que el lector esté aplicando peso extra a esas palabras. Quizás algo como:

piMiranda thought:/i What an interesting metaphor on the global economy./ppiChris thought:/i Is that mustard?/p

¿Cuál es la diferencia entre iy em?

Una vez más:

• emes para enfatizar
• ies para texto en cursiva sin énfasis

Si tiene la tentación de utilizarlo icomo título de algo, como:

p  The book   !-- Not the end of the world, but... --   iMr. Penumbra's 24-Hour Bookstore/i  is good./pp  The book   !-- ...this is more semantically correct. --   citeMr. Penumbra's 24-Hour Bookstore/cite  is good./p

Afortunadamente, los navegadores ponen en cursiva el contenido entre citeetiquetas, tal como ilo hacen, por lo que no es necesario trabajar más si estás citando una obra (por ejemplo, Moby Dick ) o una publicación (por ejemplo, The New York Times ).

Utilice su propia clase HTML y CSS

Si el objetivo es diferenciar visualmente el texto, entonces no tenemos que buscar ese ielemento. Los tramos no tienen significado semántico y se les puede diseñar para darle énfasis visual:

p  Shoes are spanon sale/span this week!/p

.emphasis {  background: lightyellow;  font-style: italic;}

La propiedad CSS font-stylees la que necesita para poner el texto en cursiva, que puede aplicar a cualquier selector que desee.

Cuidado con las “cursivas falsas”

No todas las fuentes tienen caracteres en cursiva. O bien, es posible que te encuentres en una situación en la que la versión en cursiva de la fuente no esté cargada. En cualquier caso, el navegador intentará falsificarlo de todos los modos, lo que casi siempre se ve horrible (o al menos mucho peor que usar una fuente en cursiva real).

Nada te advertirá sobre esto; solo necesitas estar atento. Aquí hay un ejemplo de la fuente Merriweather en cursiva falsa:

cursiva Unicode

Hay millones de caracteres disponibles en Unicode, incluidas letras que tienen un estilo en cursiva.

Puedes usar esto cuando no tengas control HTML para hacer cosas como cursiva como, por ejemplo, en Twitter al redactar un tweet.

La accesibilidad de esto es terrible. Llegará a cada personaje individualmente, lo que hará (presumiblemente, para mí) difícil entender la palabra. Tenga mucho cuidado al usar esto, incluso si lo usa todo.

Cursiva en fuentes variables

Este es un concepto un poco avanzado, pero existen cosas llamadas fuentes variables. Ofrece personalización directamente en el navegador. Entonces, en lugar de un segundo archivo de fuente para la versión en negrita, tienen información para ponerse en negrita con ese archivo. Pero “negrita” es sólo un ejemplo de lo que podría ofrecer una fuente variable. No todos necesariamente lo hacen.

Una fuente variable puede tener una opción “inclinada” o “cursiva” y usted puede aplicar ese aspecto de esa manera.

Ahí están, cinco respuestas diferentes a la pregunta de cuándo poner el texto en cursiva. Esperamos que esto también ayude con la siguiente pregunta lógica: ¿Qué método debo utilizar?