Explication du Positionnement Relatif
Le positionnement relatif permet de positionner un élément visuellement par rapport à sa position d'origine. Dans le même temps, les éléments voisins ne prennent pas la place de cet élément.
position: relative;
Les propriétés top
, left
, bottom
et right
peuvent être utilisées pour indiquer le déplacement visuel d’un élément par rapport à sa position initiale. Les valeurs peuvent être positives ou négatives et exprimées dans différentes unités (px
, %
, etc.). Exécutons l’exemple suivant pour observer l’effet obtenu :
index.html
index.css
Remarque
Il est essentiel de mentionner qu'il n'est pas nécessaire de spécifier toutes les propriétés
top
,bottom
,left
etright
pour un élément dont la valeur de position diffère destatic
. Il suffit de définir une propriété pour le positionnement vertical (top
oubottom
) et une pour le positionnement horizontal (left
ouright
).
Merci pour vos commentaires !
Demandez à l'IA
Demandez à l'IA
Posez n'importe quelle question ou essayez l'une des questions suggérées pour commencer notre discussion
Awesome!
Completion rate improved to 2.04
Explication du Positionnement Relatif
Glissez pour afficher le menu
Le positionnement relatif permet de positionner un élément visuellement par rapport à sa position d'origine. Dans le même temps, les éléments voisins ne prennent pas la place de cet élément.
position: relative;
Les propriétés top
, left
, bottom
et right
peuvent être utilisées pour indiquer le déplacement visuel d’un élément par rapport à sa position initiale. Les valeurs peuvent être positives ou négatives et exprimées dans différentes unités (px
, %
, etc.). Exécutons l’exemple suivant pour observer l’effet obtenu :
index.html
index.css
Remarque
Il est essentiel de mentionner qu'il n'est pas nécessaire de spécifier toutes les propriétés
top
,bottom
,left
etright
pour un élément dont la valeur de position diffère destatic
. Il suffit de définir une propriété pour le positionnement vertical (top
oubottom
) et une pour le positionnement horizontal (left
ouright
).
Merci pour vos commentaires !