css定位区别于css布局，css布局为平面上的，定位则垂直于屏幕。
从三维层面上来看，每一个盒模型从下到上分别为background，border，块状元素，浮动元素，内联子元素。
- 当浮动元素上有文字时，浮动元素的文字比内联子元素低。
position
1. position:static;
默认属性，表示当前元素在文档流中。
2. position:relative；
- 绝对位置不变，显示位置改变（较少使用）
- 配合z-index，改变堆叠顺序 z-index默认为auto，相当于0，但又不是0，因为0会创建一个单独的空间进行上下文堆叠。
- 与absolute配合，进行定位，定位基准是祖先中的非static。
3. position:absoulte；
用来进行得，制作类似于关闭框，鼠标停留显示文字。
注意：
1.absoult定位的对象是最近的一个poisiton不是static的元素；
2.必须要写top/left;
3.学会使用left:100%表示右侧；
4。学会left：50%和负margin；
4.position:fixed;
相对于“视口”
- 可以用来创建回到顶部按钮；
- 可配合zindex
注意：尽量不要用在移动端上。
5.position:sticky
层叠上下文
z-index只会和其所在的区域中的其他元素进行比较，且负z-index也无法使其逃出此区域。
常用来创建区域的属性有：html/z-index/opacity/transform。
© 饥人谷
