Introduction à l'utilisation de la position de l'attribut de positionnement telle que fixée en CSS

Cet article présente principalement l'utilisation de l'attribut de positionnement position tel que fixé dans CSS. Il a une certaine valeur de référence. Maintenant, je le partage avec vous. Les amis dans le besoin peuvent s'y référer

Quand un div le souhaite. Lors du positionnement, notre première réaction est l'attribut position. En plus de la valeur par défaut, l'attribut position comprend également l'absolu, le relatif et le fixe. Les amis qui ne comprennent pas peuvent se référer à

<.> en html, lorsqu'un p veut être positionné, notre première réaction est l'attribut position En plus de la valeur par défaut, l'attribut position a également des valeurs absolues, relatives et fixes. Lorsqu'il est défini sur fixe, vous pouvez le positionner par rapport au corps en définissant les valeurs gauche, droite, haut et bas.

Code :

.my-fiexd{ 
position:fixed; 
height:40px; 
width:40px; 
background-color:red; 
border:0px; 
}

Mais lorsqu'un p est réglé sur fixe lorsque la barre de défilement défile (en haut, de nombreux menus le feront), un petit phénomène peut se produire (peut appeler cela un bug ). Je n'entrerai pas dans le code spécifique, je parlerai juste du phénomène et des solutions.

Si une page d'une hauteur de 100px a un p avec l'identifiant my-fixed, la hauteur de my-fixed est de 20px, et lorsque la barre de défilement défile jusqu'à 30px, my-fixed est ajouté avec l'attribut fiexd , alors à ce moment-là, mon -fixed est séparé de la page et la hauteur de la page correspondante est également réduite de 20 px. La hauteur de la page est de 80 px. Il se peut que la hauteur maximale que la barre de défilement peut faire défiler soit inférieure à 30 px. À ce moment-là, my-fixed continuera à s'ajouter et il continuera à clignoter entre le fait de ne pas ajouter de fix, et finalement, my-fixed n'est pas corrigé.

La solution est d'ajouter un p à la couche externe de my-fixed et de définir la même hauteur que my-fixed, de sorte que lorsque my-fixed est détaché, la hauteur de la page ne soit pas réduite et le phénomène de scintillement sera éliminé. Bon évitement

ps : C'est la première fois que j'écris un blog. L'expression n'est peut-être pas très claire, mais le sens général doit être correct. , si quelqu'un rencontre le même problème et a une meilleure solution, veuillez me dire la solution

Ce qui précède est l'intégralité du contenu de cet article. J'espère qu'il sera utile à l'étude de chacun. Pour plus de contenu connexe, veuillez payer. attention au site PHP chinois !

Recommandations associées :

Navigation secondaire verticale implémentée par CSS3

Comment utiliser l'attribut position:fixed pour centrer un DIV

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!