quotes

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021.

La propriété quotes indique la façon dont les marques de citation sont affichées.

Exemple interactif

Syntaxe
css
/* Valeur avec un mot-clé */
quotes: none;

/* Chaînes de caractères */
/* Type <string>         */
quotes: "«" "»"; /* On utilise les guillemets français
                              pour ouvrir et fermer une citation  */
quotes: "«" "»" "‹" "›"; /* On définit deux niveaux de citation */

/* Valeurs globales */
quotes: inherit;
quotes: initial;
quotes: unset;

Valeurs

none

Les valeurs open-quote et close-quote de la propriété content n'entraînent aucune marque de citation.

[<string> <string>]+

Une ou plusieurs paires de <string> pour les valeurs open-quote et close-quote. La première paire représente les symboles utilisés pour les citations de plus haut niveau, la deuxième indique comment délimiter une citation dans une citation, la troisième paire permet d'ajouter un niveau d'imbrication supplémentaire et ainsi de suite.

Définition formelle

Valeur initialedépend de l'agent utilisateur
Applicabilitétous les éléments
Héritéeoui
Valeur calculéecomme spécifié
Type d'animationdiscrète

Syntaxe formelle

quotes = 
auto |
none |
match-parent |
[ <string> <string> ]+

Exemples

HTML

html
<p>
  <q
    >Bientôt le Lapin aperçut Alice qui furetait ; il lui cria d’un ton
    d’impatience :
    <q
      >Eh bien ! Marianne, que faites-vous ici ? Courez vite à la maison me
      chercher une paire de gants et un éventail ! Allons, dépêchons-nous.
    </q>
  </q>
</p>

CSS

css
q {
  quotes: "«" "»" '"' '"';
}

Résultat

Spécifications

Specification
CSS Generated Content Module Level 3
# quotes

Compatibilité des navigateurs

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
quotes
auto
none

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

Voir aussi