枫祺玥的小客栈

MND 文档
position:sticky仍是一个实验属性，称之为粘性定位，元素在满足阈值之前表现如 relative ，在跨越阈值后表现为 fixed；
该属性必须指定一项条件：top right bottom left作为阈值。

#one { position: sticky; top: 10px; }

上述代码表示：在 viewport 视口距离元素 top 距离大于 10px 时，元素为相对定位；一旦该距离小于 10px 元素将固定在与顶部距离 10px 的位置，直到 viewport 视口回滚到阈值以下。

注意：

* 必须指定一个属性，否则将会视为相对定位（relative）：
* 如果同时设置了 top 和 bottom ，则 top 生效，如果同时设置了 left 和 right ，则 left 生效，
* 根据实验，再跨越阈值后（即元素表现为 fixed）后，元素和表现 relative 时在文档流中的占据的位置并不会消失

用这个属性可以很容易的实现一些侧边栏随页面滚动时固定的效果，不过要注意浏览器兼容性。