当前位置: 首页 > 工具软件 > Sticky > 使用案例 >

简单理解sticky定位与fixed定位的区别

田向荣
2023-12-01

fixed:固定定位,相对于可视窗口定位,一但使用top,left绑定后,无论怎么滚动可视窗口区域(也就是滑动滚动条),它的位置都不会发生变化

sticky:粘性定位,相当于是相对定位和固定定位的结合,既有相对定位的保留自己原来位置的特点又有固定定位相对于可视窗口定位的特点,必须至少含有top,left,right,bottom中一个进行绑定,比如说position:sticky  top:100px;  margin-top:400px   那么就是说这个小盒子初始情况距离顶部400px,在向下滚动300px范围内都是相对定位展现,直到小盒子滚动到小盒子上边框距离浏览器可视窗口上沿的距离只有100px时,它转换为固定定位,就始终保持与可视窗口上沿100px的距离不再改变

 类似资料: