有趣的发现，position的sticky粘性布局

第一次写文章，鼓励本身记录下来有趣的发现。 

一直觉得position只有四个值 

 position: static; 

position: relative;

 position: absolute;

 position: fixed;

 其实还有一个很是有趣的值哟，那就是 position: sticky; 

 这是一个结合了 position:relative 和 position:fixed 两种定位功能于一体的特殊定位，适用于一些特殊场景。

 什么是结合两种定位功能于一体呢？

 元素先按照普通文档流定位，而后相对于该元素在流中的 flow root（BFC）和 containing block（最近的块级祖先元素）定位。 

然后，元素定位表现为在跨越特定阈值前为相对定位，以后为固定定位。 这个特定阈值指的是 top, right, bottom 或 left 之一，换言之，指定 top, right, bottom 或 left 四个阈值其中之一，才可以使粘性定位生效。不然其行为与相对定位相同。

 此处有一个灰常简单的小demo供参考，sticky的兼容性不太好，最好用谷歌打开哟：codepen.io/woshilyy/pen/NMLLYv 

使用sticky能够实现头部导航固定，只需简单的几行css搞定，仍是很是方便的啊