Cotizaciones - Trucos CSS | Almanaque CSS 2024

La quotespropiedad en CSS le permite especificar qué tipos de comillas se utilizan cuando las comillas se agregan mediante las reglas content: open-quote;o content: close-quote;. He aquí cómo usarlo:

q ( quotes: "“" "”" "‘" "’"; ) q::before ( content: open-quote; ) q::after ( content: close-quote; )

En el ejemplo anterior, se agregan cuatro valores. Un conjunto de comillas tipográficas dobles y un par de comillas tipográficas simples. Es un poco confuso ya que cada cita está entre comillas, pero esas son solo citas programáticas (pueden ser dobles (“) o simples (')) como en cualquier otro lugar de CSS. Las citas en el interior son las que se utilizarán en la página.

Hay cuatro valores de la propiedad de contenido que se refieren a la quotespropiedad: open-quote, close-quote, no-open-quote, y no-close-quote.

El primer par de cotizaciones en el valor son las cotizaciones de apertura y cierre. El segundo par son las cotizaciones de apertura y cierre para cotizaciones anidadas en un nivel profundo dentro de otras cotizaciones que también usan la quotespropiedad. Por ejemplo, un elemento dentro de un elemento.

Algunos ejemplos:

Comillas dobles en la primera cita, comillas simples en la segunda.

Una cita con citas en francés.

Puede colocar tantos pares de citas en la quotespropiedad como desee. Pero no tiene que poner más de dos, porque por cada cita adicional simplemente repite los quotesvalores desde el principio.

Los valores no-open-quotey no-close-quoteevitan que se muestren las cotizaciones, pero continúan aumentando la profundidad de la cotización.

Más información

No use el elemento a menos que esté citando a alguien. En todos los demás casos (ironía, sarcasmo o cualquier otra cosa para la que use comillas) simplemente use las comillas (como estas: “”).
Esto no es solo para el elemento, podría ser
también o cualquier otra cosa.
Citas y acentos