CSS - Mode d'écriture
Types de modes d'écriture
Horizontal-tb (Par défaut)
Le mode d'écriture horizontal-tb est le mode par défaut en CSS. Dans ce mode, le texte s'écoule horizontalement de gauche à droite, et la ligne suivante apparaît en dessous de la précédente. C'est courant pour les langues écrites horizontalement, comme le français.
Conseil: Exemple de code
.horizontal-tb {
writing-mode: horizontal-tb;
}Vertical-rl
Le mode d'écriture vertical-rl affiche le texte verticalement, avec les lignes s'écoulant de droite à gauche. Le texte est pivoté de 90 degrés dans le sens horaire, et la ligne suivante apparaît à gauche de la précédente. Ce mode est utile pour les menus de navigation verticaux ou l'affichage de texte dans des langues traditionnellement écrites verticalement, comme le japonais ou le chinois.
Conseil: Exemple de code
.vertical-rl {
writing-mode: vertical-rl;
}Vertical-lr
Le mode d'écriture vertical-lr est similaire à vertical-rl, mais les lignes s'écoulent de gauche à droite. Le texte est pivoté de 90 degrés dans le sens antihoraire, et la ligne suivante apparaît à droite de la précédente. Ce mode peut être utilisé pour des mises en page de texte vertical.
Conseil: Exemple de code
.vertical-lr {
writing-mode: vertical-lr;
}Sideways-rl
Le mode d'écriture sideways-rl affiche le texte verticalement avec les lignes s'écoulant de droite à gauche. Contrairement à vertical-rl, les caractères ne sont pas pivotés et restent droits. Ce mode est utile pour des mises en page verticales compactes ou des étiquettes verticales courtes.
Conseil: Exemple de code
.sideways-rl {
writing-mode: sideways-rl;
}Sideways-lr
Le mode d'écriture sideways-lr est similaire à sideways-rl, mais les lignes s'écoulent de gauche à droite. Les caractères restent droits, et la ligne suivante apparaît à droite de la précédente. Ce mode peut être appliqué dans des scénarios de conception spécifiques nécessitant une mise en page verticale compacte.
Conseil: Exemple de code
.sideways-lr {
writing-mode: sideways-lr;
}