position:sticky是一个css3属性，类似position:relative和position:fixed的合体，目标区域在屏幕中可见时，它的行为就像position:relative; 而当页面滚动超出目标区域时，它的表现就像position:fixed，它会固定目标位置。
用法：
.sticky{
position: -webkit-sticky;
position: sticky;
top: 0;
left: 0;
}
实现效果请看这张GIF图
注意事项：
必须至少指定 top, right, bottom 或 left 四个值的任意一个，否则其行为与相对定位相同。并且 top 和 bottom 同时设置时，top 生效的优先级高，left 和 right 同时设置时，left 的优先级高。
兼容性：
这是一个新属性，没有被浏览器很好的兼容，下图为兼容性示意图
