Cette fonction est expérimentale
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

La propriété hanging-punctuation indique si un signe de ponctuation se situant au début ou à la fin d'une ligne de texte doit rester sur cette ligne, quitte à sortir de la boîte qui représente la ligne.

/* Valeurs avec un mot-clé */
hanging-punctuation: none;
hanging-punctuation: first;
hanging-punctuation: last;
hanging-punctuation: force-end;
hanging-punctuation: allow-end;

/* Valeurs avec deux mots-clés */
hanging-punctuation: first force-end;
hanging-punctuation: first allow-end;
hanging-punctuation: first last;
hanging-punctuation: last force-end;
hanging-punctuation: last allow-end;

/* Valeurs avec trois mots-clés */
hanging-punctuation: first force-end last;
hanging-punctuation: first allow-end last;

/* Valeurs globales */
hanging-punctuation: inherit;
hanging-punctuation: initial;
hanging-punctuation: unset;

Valeur initialenone
Applicabilitétous les éléments
Héritéeoui
Médiavisuel
Valeur calculéecomme spécifié
Type d'animationdiscrète
Ordre canoniquel'ordre unique et non-ambigu défini par la grammaire formelle

Syntaxe

Cette propriété peut être définie grâce à une, deux ou trois valeurs :

  • Avec une valeur : on utilisera l'un des mots-clés de la liste ci-après
  • Avec deux valeurs :
    • le mot-clé first avec un des mots-clés parmi : last, allow-end ou force-end
    • ou le mot-clé last avec un des mots-clés parmi : last, allow-end ou force-end
  • Avec trois valeurs :
    • first, allow-end et last
    • ou first, force-end et last

Valeurs

none
Aucun caractère ne reste suspendu sur la ligne.
first
Une parenthèse ou des guillemets ouvrants au début de la première ligne d'un texte restent sur la ligne.
last
Une parenthèse ou des guillemets fermants à la fin de la dernière ligne d'un texte restent sur la ligne.
force-end
Un point ou une virgule en fin de ligne restera sur cette ligne.
allow-end
Un point ou une virgule en fin de ligne restera sur cette ligne si la justification du texte ne laisse pas l'espace nécessaire.

Syntaxe formelle

none | [ first || [ force-end | allow-end ] || last ]

Exemple

HTML

<p>
   Lorem ipsum dolor sit amet, consectetur
   adipiscing elit. Curabitur dignissim nunc
   mauris, et sollicitudin est scelerisque 
   sed. Praesent laoreet tortor massa, sit
   amet vulputate nulla pharetra ut. Proin
   ornare commodo sodales. Class aptent 
   taciti sociosqu ad litora torquent per
   conubia nostra, per inceptos himenaeos.
</p>

CSS

p {
  hanging-punctuation: first;
  margin: .5rem;
}

Résultat

Spécifications

Spécification État Commentaires
CSS Text Module Level 3
La définition de 'hanging-punctuation' dans cette spécification.
Version de travail Définition initiale.

Compatibilité des navigateurs

Update compatibility data on GitHub
OrdinateurMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariWebview AndroidChrome pour AndroidEdge MobileFirefox pour AndroidOpera pour AndroidSafari pour iOSSamsung Internet
Support simple
Expérimentale
Chrome Aucun support NonEdge Aucun support NonFirefox Aucun support NonIE Aucun support NonOpera Aucun support NonSafari Support complet 10WebView Android Aucun support NonChrome Android Aucun support NonEdge Mobile Aucun support NonFirefox Android Aucun support NonOpera Android Aucun support NonSafari iOS Support complet 10Samsung Internet Android Aucun support Non

Légende

Support complet  
Support complet
Aucun support  
Aucun support
Fonctionnalité expérimentale. Celle-ci peut être amenée à changer par la suite.
Fonctionnalité expérimentale. Celle-ci peut être amenée à changer par la suite.

Étiquettes et contributeurs liés au document

Contributeurs à cette page : SphinxKnight
Dernière mise à jour par : SphinxKnight,