元素在页面中的布局遵守一套文档流的方式，默认的定位属性值为static。它其实是未被设置定位的。
元素如果被定位了，那么它的top,left,bottom,right值就会生效，能设置定位的属性是relative,absolute和fixed。
需要注意的另一点是被定位的元素层次(z-index)会得到提高。
relative
自己通过定位跑开了还用着原来的位置，不会给周围的诸如文本流之类的元素
设置了相对定位之后，通过修改top,left,bottom,right值，元素会在自身文档流所在位置上被移动，其他的元素则不会调整位置来弥补它偏离后剩下的空隙。
- 不影响元素本身的特性
- 不使元素脱离文档流
absolute
设置了绝对定位之后，元素脱离文档流，其他的元素会调整位置来弥补它偏离后剩下的空隙。元素偏移是相对于是它最近的设置了定位属性（position值不为static）的元素。
- 使元素完全脱离文档流
- 使内嵌元素支持宽高
- 块属性标签内容撑开宽度
- 如果有定位父级则相当于定位父级发生偏移，没有定位父级则相当于整个文档发生偏移
fixed(固定定位)
设置了固定定位之后，元素相对的偏移的参考是可视窗口，即使页面滚动，元素仍然会在固定位置
static(默认值)
没有定位，元素出现在正常的流中
position: sticky
是一个新的css3属性，它的表现类似position:relative和position:fixed的合体，在目标区域在屏幕中可见时，它的行为就像position:relative; 而当页面滚动超出目标区域时，它的表现就像position:fixed，它会固定在目标位置。