Share
Comillas, comillas, comillas invertidas; como se llame a estas formas de puntuación, es posible que las esté utilizando incorrectamente. Echemos un vistazo rápido a lo que es correcto, lo que no lo es y lo que puede hacer dentro de su CSS para asegurarse de que sus citas tengan el formato correcto.
Empecemos por ilustrar de lo que estamos hablando aquí. Existen varias formas de lo que reconocemos como comillas, y cada una tiene su propio propósito específico. Al puntuar la escritura, debe usar "comillas inteligentes" o "comillas":
Eso se aplica tanto al doble y comillas simples.
E incluso apóstrofes:
En la web, sin embargo, comúnmente verá "citas tontas". Estas son versiones directas, que a menudo se usan debido a los valores predeterminados establecidos en los CMS y las aplicaciones. Incluso su teclado usualmente hará que sea difícil usar cualquier cosa que no sean citas tontas.
Las citas tontas no deben confundirse con "números primos"; glifos separados que se usan para denotar medidas, como pies y pulgadas, coordenadas y unidades aún más complicadas usadas en la fabricación de relojes, por ejemplo.
Los términos suelen ser diferentes a las citas tontas, ya que se inclinan ligeramente, pero eso es, por supuesto, completamente del tipo de letra..
Código. Ese es prácticamente el único lugar donde deberías usarlos técnicamente..
Como se mencionó anteriormente, su teclado no lo ayudará mucho cuando intente usar las citas correctas. De hecho, mientras escribo esto, estoy lanzando citas tontas por todo el lugar, tendré que hacer una búsqueda y reemplazar luego!
Si tu documento está usando el juego de caracteres utf-8
luego podrá pegar las comillas correctas directamente. Alternativamente, deberá usar las entidades numéricas o con nombre HTML, o (para CSS) los valores de Unicode escapados:
| glifo | entidad nombrada | entidad numérica | unicode escapado |
" | “ | " | \ 201C |
” | ” | ” | \ 201D |
' | ‘ | " | \ 2018 |
' | ’ | ’ | \ 2019 |
Podemos usar el citas propiedad en CSS para asegurarse de que nuestra y Los elementos están adecuadamente decorados con las comillas correctas. los citas la propiedad acepta cuatro valores en secuencia, cada uno de los cuales define qué personaje usar en cada circunstancia:
Podría verse un poco así:
q, blockquote quotes: "\ 201C" "\ 201D" "\ 2018" "\ 2019";
Aquí estamos apuntando tanto a citas en línea como a blockquotes. Estamos utilizando valores de Unicode escapados (mencionados anteriormente en la tabla) para determinar qué glifos se utilizarán para abrir y cerrar nuestros elementos de cotización. Hemos declarado que queremos que se abra una comilla doble, luego la marca de cierre doble para cerrar. Los elementos de cita anidados tendrán marcas únicas aplicadas.
Echa un vistazo a esta demostración. En ella, verás un Nota: Estas comillas están ubicadas en el uso de pseudo elementos, por lo que solo los navegadores compatibles mostrarán las comillas de esta manera. Otras propiedades nos permiten aún más control. Podemos continuar controlando específicamente esos pseudo elementos, indicando si nos gustaría que se muestren las marcas de apertura o de cierre.. En este código, hemos alterado el contenido de los pseudo-elementos, diciendo que en realidad no queremos que se muestre una cita de cierre.. Sin embargo, no todos muestran las comillas de la misma manera. Eche un vistazo a lo que usan los franceses, por ejemplo.. Estos se denominan guillemets (no, no guillemots) y son solo un ejemplo de comillas alternativas. Afortunadamente, somos libres de usar las entidades correctas para cualquier idioma que necesitemos. Y podemos apuntar al Excusas para mon français también, si he hecho eso mal ... Sea inteligente, no hay excusa para usar citas tontas!Quiero mas poder!
q: antes, blockquote: antes contenido: cotización abierta; q: after, blockquote: after content: no-close-quote;
Brecha de lenguaje
lang atributo en el html Elemento para ser específico (gracias fliptheweb por ese pequeño consejo).
...
html [lang = "fr"] q quotes: "\ 00ab" "\ 00bb";
Conclusión
Recursos adicionales
Accentsconagua