css-postition:sticky

sticky 的本意是粘糊糊的,但在 css 中的表现更像是吸附。常见的吸顶、吸底(移动端网站的头部返回栏,底部切换栏之类)的效果用这个属性非常适合。

.sticky { 
  position: sticky; 
  position: -webkit-sticky; 
  top: 0; 
} 
特性(坑):
1.sticky不会触发BFC,
2.z-index无效,
3.当父元素的height:100%时,页面滑动到一定高度之后sticky属性会失效。
4.父元素不能有overflow:hidden或者overflow:auto属性。
5.父元素高度不能低于sticky高度,必须指定top、bottom、left、right4个值之一。


原文地址:https://www.cnblogs.com/lxz-blogs/p/12807223.html