定义和用法
position 属性规定元素的定位类型。
定位类型
static：无特殊定位，对象遵循正常文档流。top，right，bottom，left等属性不会被应用。
relative：对象遵循正常文档流，但将依据top，right，bottom，left等属性在正常文档流中偏移位置。而其层叠通过z-index属性定义。
absolute：对象脱离正常文档流，使用top，right，bottom，left等属性进行绝对定位。而其层叠通过z-index属性定义。
fixed：对象脱离正常文档流，使用top，right，bottom，left等属性以窗口为参考点进行定位，当出现滚动条时，对象不会随着滚动。而其层叠通过z-index属性定义。
inherit：规定应该从父元素继承 position 属性的值。
什么是文档流？
将窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素,即为文档流。
只有三种情况会使得元素脱离文档流，分别是：浮动、绝对定位和相对定位。
<div style="position:relative; width:300px; height:300px; background-color:silver; border:5px solid red;">
<div style="width:100px; height:100px; background-color:blue;"></div>
<div style="margin:0 0 0 100px; width:200px; height:200px; background-color:gold;">
<div style="position:absolute; left:100px; top:100px; width:100px; height:100px; background-color:green;">
</div>
</div>
</div>
示意：
