Explication détaillée sur l'utilisation de la direction en CSS

1.

Dans les applications ordinaires, je fais rarement attention à l'utilisation de la direction CSS. Aujourd'hui, j'ai parfois vu du contenu pertinent et j'ai trouvé que la direction CSS est souvent très pratique à utiliser.

2. Tout d'abord, nous devons faire attention à deux contenus importants :

direction:ltr;//这个是默认值
direction:rtl

ltr est la valeur initiale, ce qui signifie de gauche à droite, ce qui signifie de gauche à droite. rtl est une autre valeur, l'abréviation de droite à gauche, qui signifie de droite à gauche.

<p class="rtl">
	<img src="1.png"/>
	<img src ="2.png"/>
</p>

Si la direction est définie sur l'attribut trl pour p, alors 1.png sera activé le côté droit, 2.png est sur le côté gauche.

Il est à noter que si l'attribut rtl est défini, l'ordre du texte reste inchangé :

<p class="rtl"><span>span1</span> <span>span2</span></p>

Étant donné que seul l'ordre gauche et droit du bloc d'éléments en ligne est modifié, tout le texte, même s'il est séparé par un élément en ligne balises, En fait, il s'agit toujours d'une boîte en ligne homogène et est traitée dans son ensemble, il n'y a donc qu'un effet d'alignement approximatif à droite, mais il n'y a aucun changement dans l'ordre gauche et droit de chaque texte.

Alors, qu'est-ce qu'un « bloc d'éléments en ligne » ? Y compris les éléments remplacés, tels que a1f02c36ba31691bcfe87b2722de723b, bb9345e55eb71822850ff156dfde57c8, d5fd7aea971a85678ba271703566ebfd, 39000f942b2545a5315c57fa3276f220, 273238ce9338fbb04bee6997e5552b95, etc., ou des éléments horizontaux de bloc en ligne. Par conséquent, dans les exemples ci-dessus de span1 et span2, si un span est défini sur display:inline-block, vous verrez les changements dans l'ordre de gauche et de droite.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!