Maison >interface Web >tutoriel CSS >Quelles sont les valeurs de la propriété CSS Position ?

Quelles sont les valeurs de la propriété CSS Position ?

Guanhui
Guanhuioriginal
2020-06-24 15:05:2112083parcourir

Les valeurs des attributs CSS Position sont : 1. statique, qui est la valeur par défaut de la position ; 2. fixe, qui génère des éléments positionnés de manière fixe ; 3. absolu, qui génère des éléments positionnés de manière absolue ; qui génère des éléments relativement positionnés; 5. hériter, hériter de la valeur de l'attribut parent.

Quelles sont les valeurs de la propriété CSS Position ?

1. position : relative ; le positionnement relatif

  • n'affecte pas les caractéristiques de l'élément lui-même (que ce soit le élément de bloc ou l'élément interne L'élément lié conservera ses caractéristiques d'origine)

  • ne retirera pas l'élément du flux de documents (la position d'origine de l'élément sera conservée et la nouvelle position sera ne pas être occupé même si la position est modifiée)

  • Sans décalage de positionnement, cela n'a aucun effet sur l'élément (décalage par rapport à sa position d'origine)

  • Promouvoir le niveau (vous pouvez utiliser la valeur du style z-index) Changer la relation hiérarchique d'un élément positionné, modifiant ainsi la relation de couverture de l'élément. Plus la valeur est grande, plus l'indice Z peut être élevé. ne sera efficace que sur les éléments dont la valeur de l'attribut de position est relative, absolue ou fixe.) (Les deux sont des éléments positionnés, ce dernier écrasera le positionnement précédent)

2. position : absolue ; le positionnement absolu

  • rend l'élément complètement hors du flux de documents (dans le flux de documents n'occupe plus d'espace)

  • Activer la prise en charge des éléments en ligne width et height lors de la définition de la largeur et de la hauteur (modifier les caractéristiques des éléments en ligne)

  • Faire en sorte que l'élément de bloc étende sa largeur par le contenu lorsque la largeur n'est pas définie (modifier les propriétés du élément de bloc)

  • Décalage par rapport à l'élément parent positionné le plus proche (si son parent Si l'élément n'est pas positionné, recherchez-le couche par couche jusqu'à document - page objet document)

  • Le positionnement relatif est généralement utilisé en conjonction avec le positionnement absolu (définir le positionnement relatif de l'élément parent afin qu'il soit relatif au décalage de l'élément parent)

  • Promouvoir le niveau (identique au positionnement relatif)

3. position : fixe ; positionnement fixe

génération fixe Les éléments positionnés fixes sont positionnés par rapport à la fenêtre du navigateur.

4. position:static : valeur par défaut

Mise en page par défaut. L'élément apparaît dans un flux normal (en ignorant les déclarations haut, bas, gauche, droite ou z-index).

6. position : hériter

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

Tutoriel recommandé : "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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn