Que signifie la position en CSS ?

La position en CSS est un attribut qui précise le type de positionnement d'un élément. L'attribut position définit le mécanisme de positionnement utilisé pour établir la disposition de l'élément. N'importe quel élément peut être positionné, mais les éléments absolus ou fixes généreront une boîte au niveau du bloc, quel que soit le type de l'élément lui-même.

Environnement :

Cet article s'applique à toutes les marques d'ordinateurs.

(Partage de vidéos d'apprentissage : tutoriel vidéo CSS)

Introduction à l'attribut :

L'attribut position spécifie le type de positionnement de l'élément.

Cet attribut définit le mécanisme de positionnement utilisé pour établir la disposition de l'élément. N'importe quel élément peut être positionné, mais les éléments absolus ou fixes génèrent une boîte au niveau du bloc, quel que soit le type de l'élément lui-même. Un élément positionné relativement est décalé par rapport à sa position par défaut dans un écoulement normal.

Valeur de l'attribut :

• absolu Génère un élément en position absolue, positionné par rapport au premier élément parent autre que le positionnement statique. La position de l'élément est spécifiée via les attributs "left", "top", "right" et "bottom".

• fixe Génère des éléments positionnés de manière absolue, positionnés par rapport à la fenêtre du navigateur. La position de l'élément est spécifiée via les attributs "left", "top", "right" et "bottom".

• relative Génère un élément relativement positionné, positionné par rapport à sa position normale. Par conséquent, "left:20" ajoute 20 pixels à la position GAUCHE de l'élément.

• Valeur statique par défaut. Sans positionnement, l'élément apparaît dans un flux normal (en ignorant les déclarations haut, bas, gauche, droite ou z-index).

• inherit spécifie que la valeur de l'attribut position doit être héritée de l'élément parent.

Exemple :

Positionnement des éléments h2 :

h2
  {  
  position:absolute;
  left:100px;
  top:150px;
  }

Recommandations associées : Tutoriel 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!