Share
Guillemets, marques de langage, guillemets; quoi que vous appeliez ces formes de ponctuation, vous pourriez bien les utiliser de manière incorrecte. Examinons rapidement ce qui est correct, ce qui ne l’est pas et ce que vous pouvez faire dans votre code CSS pour vous assurer que vos citations sont correctement formatées..
Commençons par illustrer ce dont nous parlons ici. Nous reconnaissons les guillemets sous plusieurs formes, chacune ayant sa propre finalité. Lorsque vous ponctuez l'écriture, vous devez utiliser des «guillemets intelligents» ou «des guillemets bouclés»:
Cela vaut à la fois double et guillemets simples.
Et même des apostrophes:
Sur le Web, cependant, vous verrez souvent des «citations stupides». Ce sont des versions simples, qui sont souvent utilisées en raison des valeurs par défaut définies dans les CMS et les applications. Même votre clavier rendra difficile l'utilisation de tout, sauf des citations stupides.
Les citations muettes ne doivent pas être confondues avec des «nombres premiers»; glyphes séparés utilisés pour désigner les mesures, tels que pieds et pouces, coordonnées et même des unités plus complexes utilisées en horlogerie, par exemple.
Les primes sont généralement différentes des citations muettes en ce qu'elles sont légèrement inclinées, mais c'est bien sûr entièrement dû à la police de caractères..
Code. C'est à peu près le seul endroit où vous devriez techniquement les utiliser.
Comme mentionné, votre clavier ne vous aidera pas beaucoup lorsque vous essayez d'utiliser des citations correctes. En fait, au fur et à mesure que je tape ceci, je jette des citations stupides partout-je devrai faire une recherche et remplacer après!
Si votre document utilise charset utf-8
vous pourrez ensuite coller les guillemets corrects directement. Vous pouvez également utiliser les entités HTML nommées ou numériques, ou (pour CSS) les valeurs unicode échappées:
| glyphe | entité nommée | entité numérique | échappé à l'unicode |
“ | “ | “ | \ 201C |
” | ” | ” | \ 201D |
' | ‘ | « | \ 2018 |
' | ’ | " | \ 2019 |
Nous pouvons utiliser le citations propriété en CSS pour vous assurer que notre et les éléments sont correctement décorés avec les guillemets corrects. le citations La propriété accepte quatre valeurs en séquence, chacune définissant le caractère à utiliser dans chaque situation:
Cela pourrait ressembler un peu à ceci:
q, blockquote quotes: "\ 201C" "\ 201D" "\ 2018" "\ 2019";
Ici, nous ciblons les guillemets en ligne et les guillemets. Nous utilisons des valeurs unicode échappées (mentionnées dans le tableau précédent) pour déterminer les glyphes qui seront utilisés pour ouvrir et fermer nos éléments de citation. Nous avons indiqué que nous voulions un guillemet double à ouvrir, puis un double repère à la fermeture. Une seule marque est appliquée aux éléments de citation imbriqués.
Jetez un coup d'oeil à cette démo. Dans ce document, vous verrez un Remarque: Ces guillemets utilisent des pseudo-éléments. Par conséquent, seuls les navigateurs prenant en charge afficheront les guillemets de cette façon.. D'autres propriétés nous permettent encore plus de contrôle. Nous pouvons continuer à contrôler spécifiquement ces pseudo-éléments, en précisant si nous souhaitons que les marques d’ouverture ou de fermeture soient affichées.. Dans ce code, nous avons modifié le contenu des pseudo-éléments, indiquant que nous ne souhaitons pas afficher de citation de clôture.. Cependant, tout le monde n’affiche pas les guillemets de la même manière. Regardez ce que les Français utilisent, par exemple. Ce sont des guillemets (non, pas des guillemots) et ce ne sont que des exemples de guillemets alternatifs. Heureusement, nous sommes libres d'utiliser les entités appropriées pour la langue dont nous avons besoin. Et nous pouvons cibler le Des excuses pour mon français aussi, si j'ai mal agi… Soyez intelligent, il n'y a aucune excuse pour utiliser des citations stupides!Je veux plus de pouvoir!
q: before, blockquote: before content: open-quote; q: après, blockquote: après content: no-close-quote;
Lacune linguistique
lang attribuer sur le html l'élément doit être spécifique (merci fliptheweb pour ce petit conseil).
…
html [lang = "fr"] q guillemets: "\ 00ab" "\ 00bb";
Conclusion
Ressources supplémentaires
Accentsconagua