CSS定位中的Fixed定位
相对定位没有脱离文档流,相对于原来的位置。position: relative;top: 20px;right: 20px;绝对定位脱离文档流了,(相对于父元素。一般是以<body>为参考的,但若父容器设置了相对或者绝对定位,就以父元素为主)(控制堆叠顺序 ( z-index )注意,没有单位·`)position: absolute;top: 20px..
·
-
相对定位
没有脱离文档流,相对于原来的位置。
position: relative; top: 20px; right: 20px;
-
绝对定位
脱离文档流了,(相对于父元素。一般是以<body>为参考的,但若父容器设置了相对或者绝对定位,就以父元素为主)(控制堆叠顺序 ( z-index )注意,没有单位·`)
position: absolute; top: 20px; left: 20px;
-
固定定位
脱离文档流了,(相对于浏览器窗口,设置后,不管滚动条怎么滚动,位置都在不变 。)
position: fixed; top: 20px; left: 20px;
-
黏性定位(当页面滚动未超出目标区域时,它的行为就像
position:relative;
。当页面滚动超出目标区域时,它的表现就像position:fixed;
,它会固定在目标位置。当元素位置固定在目标区域时,会受其直接父元素影响)position: sticky; top:60px; left: 30px;
更多推荐
已为社区贡献1条内容
所有评论(0)