Quelles sont les fonctions des différents attributs de position ?

Les quatre valeurs d'attribut communes​​de position : relative, absolue, fixe, statique. Généralement utilisé en conjonction avec les attributs « left », « top », « right » et « bottom ».

Expliquons-le en détail ci-dessous :

statique : emplacement par défaut

En général, nous n'avons pas besoin de le déclarer spécifiquement, mais parfois en cas d'héritage, nous ne voulons pas voir les attributs hérités par l'élément s'affecter, nous pouvons donc utiliser Position:static pour annuler l'héritage, c'est-à-dire pour restaurer la valeur par défaut du positionnement de l'élément. Un élément défini sur static sera toujours à la position donnée par le flux de la page (les éléments statiques ignorent les déclarations haut, bas, gauche ou droite). Pas couramment utilisé.

relatif : Positionnement relatif

Le positionnement relatif est relatif à la position par défaut de l'élément. Ses valeurs de décalage en haut, à droite, en bas et à gauche sont toutes basées. dessus. La position d'origine est le décalage de base, indépendamment de ce qui arrive aux autres éléments. Notez que l'élément déplacé relatif occupe toujours de l'espace dans sa position d'origine.

absolu : positionnement absolu

Un élément défini sur absolu, si son conteneur parent a un attribut de position défini et que la valeur de l'attribut de position est absolue ou relative, alors il sera compensé en fonction du conteneur parent. Si son conteneur parent ne définit pas la propriété position, le décalage est basé sur le corps. Notez que les éléments avec l'attribut absolu défini n'occupent pas de position dans le flux standard.

fixe : positionnement fixe

Les éléments dont la position est définie sur fixe peuvent être positionnés à des coordonnées spécifiées par rapport à la fenêtre du navigateur. L'élément restera dans cette position, que la fenêtre défile ou non. C’est toujours basé sur le corps. Notez que les éléments avec l'ensemble d'attributs fixes n'occupent pas de position dans le flux standard.

Tutoriel recommandé : Démarrage rapide avec CSS

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!