css3 différence de positionnement

1.css3 distinction de positionnement
(1) le positionnement relatif (position: relative)
① Si aucun positionnement décalé de l'élément lui - même est sans effet
② éléments sans sortir du flux de documents
③ pas d' incidence sur la mise en page d'autres éléments
Note: gauche, haut , à droite, en bas décalé par rapport à l'élément en cours elle-même

(2) Le positionnement absolu (position: absolu)
① que l'élément complètement hors du flux de documents
② que la largeur du support d'élément de ligne et la hauteur (si comprend inline une caractéristique de bloc)
③ ce que les éléments de bloc par défaut largeur détermination du contenu ( de sorte que le bloc comprend basée en ligne caractéristiques)
Si un élément de positionnement positionné par rapport à l'ancêtre des ancêtres décalés, ne soit pas positionné par rapport à l'ensemble de documents ancêtre décalé (absolu, relatif, fixés).
Insérer ici l'image Description
NOTE: S'il y a une pluralité d'éléments comprend un mode de positionnement, le décalage est de trouver le plus proche élément ancêtre, le positionnement du décalage ne peut pas être utilisé seul, doit être positionné avec les éléments ancêtres.

(3) positionnement fixe (position: Fixe)
① que l'élément complètement hors du flux de documents
② que la largeur du support d'élément de ligne et la hauteur (si comprend inline une caractéristique de bloc)
③ ce que les éléments de bloc par défaut largeur détermination du contenu ( de sorte que le bloc comprend basée en ligne caractéristiques)
ont été l' impact offset, pas la barre de défilement du navigateur par rapport à l'ensemble de la fenêtre du navigateur, ne sera pas les éléments ancêtres concernés.

(4) Lieu visqueux (position: collant)
sans que la position spécifiée, l'effet ne se trouve pas, atteint la position désignée, il devient un motif fixe.

Petit savoir: z-index: 0 par défaut, est supérieur à ce qui précède, il peut être négatif, plus de temps commencera avec le même niveau de la première comparaison, lorsque la comparaison, doit être en mode positionnement.

Publié sept articles originaux · louange gagnées 0 · Vues 80

Je suppose que tu aimes

Origine blog.csdn.net/weixin_43310703/article/details/104456841
conseillé
Classement