Cette page a été traduite à partir de l'anglais par la communauté.Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.
Valeurs relatives au flux
En CSS, lesvaleurs relatives au flux sont des mots-clés directionnels relatifs aux axes de bloc et en ligne d'un élément. Ces valeurs incluentblock-start,block-end,inline-start,inline-end,start etend.
En CSS, lespropriétés physiques définissent des positions basées sur des directions physiques et font référence à des côtés spécifiques d'un élément.
Lespropriétés logiques CSS, quant à elles, définissent la mise en forme en fonction du mode d'écriture et de la direction du document plutôt que des dimensions physiques de la zone d'affichage (viewport en anglais). Les propriétés logiques sont relatives au flux du contenu et utilisent des mots-clés directionnels relatifs aux axes de bloc et en ligne.
Dans cet article
Direction de bloc
L'axe de bloc désigne l'axe qui définit l'ordre d'empilement des éléments dans une présentation en bloc. Il s'agit essentiellement de la direction le long de laquelle les blocs de contenu — comme les paragraphes (<p>), les titres et les divs (<div>) — sont disposés sur une page web. Cela correspond aussi à ladirection de bloc. Dans les langues écrites de gauche à droite et de droite à gauche, la direction de bloc est la direction verticale du flux de contenu, allant de haut en bas.
Les directionsblock-start etblock-end représentent respectivement lebord de début et lebord de fin du contenu le long de l'axe de bloc, ou les directions « de » et « vers »,block-start étant l'équivalent detop etblock-end l'équivalent debottom dans les modes d'écriture horizontaux.
Direction en ligne
L'axe en ligne est perpendiculaire à l'axe de bloc. L'axe en ligne représente la direction le long de laquelle le contenu en ligne comme le texte s'écoule à l'intérieur d'un bloc. Cela correspond aussi à ladirection en ligne. Dans les modes d'écriture de gauche à droite, comme l'anglais, la direction en ligne est horizontale, de gauche à droite. Dans les langues de droite à gauche, comme l'arabe et l'hébreu, la direction en ligne est horizontale, de droite à gauche.
Inline-start etinline-end représentent respectivement lebord de début et lebord de fin du contenu le long de l'axe en ligne, les valeurs et propriétésinline-start etinline-end étant l'équivalent des propriétés et valeursleft etright dans les modes d'écriture horizontaux. Leur équivalence àright ouleft dépend de la direction d'écriture. Par exemple,inline-start est équivalent àleft dans les langues de gauche à droite et àright dans les langues de droite à gauche.
Début et fin
Les effets d'une propriété CSS peuvent être unidimensionnels ou bidimensionnels. Par exemple,text-align concerne uniquement la direction d'inline du texte, donc est unidimensionnelle. Lorsqu'elles sont limitées contextuellement à une seule dimension, les valeurs relatives au flux sont abrégées enstart ouend.