text-orientation

La propriété text-orientation définit l'orientation du texte sur une ligne. Cette propriété n'a d'effet qu'en mode vertical (autrement dit, quand writing-mode n'est pas horizontal-tb). Elle est utile pour contrôler l'affichage de l'écriture pour les langues dont le script est vertical. Elle permet aussi de gérer les en-têtes de tableaux verticaux.

Syntaxe

/* Valeurs avec un mot-clé */
text-orientation: mixed;
text-orientation: upright;
text-orientation: sideways-right;
text-orientation: sideways-left;
text-orientation: sideways;
text-orientation: use-glyph-orientation;

/* Valeurs globales */
text-orientation: inherit;
text-orientation: initial;
text-orientation: unset;

La propriété text-orientation peut valoir l'un des mots-clés suivants.

Valeurs

mixed
Ce mot-clé permet de tourner les caractères de 90° dans le sens des aiguilles d'une montre pour les scripts horizontaux, les glyphes des scripts verticaux sont affichés normalement. C'est la valeur par défaut.
upright
Ce mot-clé permet d'afficher les caractères des scripts horizontaux normalement et d'afficher les glyphes des scripts verticaux « debout ». Ce mot-clé implique que tous les caractères soient considérés comme ltr (left-to-right ou gauche à droite). La valeur utilisée pour direction sera ltr, quelle que soit celle définie par l'utilisateur.
sideways
Ce mot-clé permet d'afficher les caractères comme s'ils étaient disposés horizontalement et que la ligne de base était tournée de 90° dans le sens des aiguilles d'une montre.
sideways-right
Un alias pour sideways conservé pour des raisons de compatibilité.
use-glyph-orientation
Pour les éléments SVG, ce mot-clé permet d'utiliser la valeur des propriétés SVG dépréciées glyph-orientation-vertical et glyph-orientation-horizontal.

Syntaxe formelle

mixed | upright | sideways

Exemples

HTML

<p class="monTexte">Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>

CSS

.monTexte {
  writing-mode: vertical-rl;
  text-orientation: sideways;
}

Résultat

Spécification

Spécification Statut Commentaires
CSS Writing Modes Module Level 3
La définition de 'text-orientation' dans cette spécification.
Recommendation proposée Définition initiale.
Valeur initialemixed
Applicabilitétous les éléments exceptés les groupes de lignes, les lignes, les groupes de colonnes et les colonnes de tableaux
Héritéeoui
Valeur calculéecomme spécifié
Type d'animationdiscrète

Compatibilité des navigateurs

BCD tables only load in the browser

Voir aussi