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个值之一。
1.sticky不会触发BFC,
2.z-index无效,
3.当父元素的height:100%时,页面滑动到一定高度之后sticky属性会失效。
4.父元素不能有overflow:hidden或者overflow:auto属性。
5.父元素高度不能低于sticky高度,必须指定top、bottom、left、right4个值之一。