CSS 定位

【1】

——html中3种布局方式：

   （1）标准流（顺序布局）：

元素会自动从左往右，从上往下的流式排列。并最终窗体自上而下分成一行行，并在每行中从左至右的顺序排放元素。

   （2）浮动 float ：

   （3）定位 position ： 可选参数有 static 、absolute  、 relative 、 fixed 、 inherit

           static       :   默认值，即标准流

           relative   :   相对定位，相对于元素原始位置进行定位，可以通过 left 、right、top、bottom 属性来确定元素相对正常文档流位置的偏移的定位，后写的元素默认大于先写的元素的层级； 设置 left 元素右移（相对于窗口），设置 right 元素左移，设置 top 元素下移，设置 bottom 元素上移 ，或者说 left top x轴在右，y轴在下，right、bottom x轴在左，y轴在上。

           absolute :    绝对定位，相对于祖先元素，若祖先元素没有定位属性，则子元素会相对于当前窗口定位，可以通过 left、 right、bottom、top属性来确定元素相对于祖先元素或当前界面的偏移定位，脱离了标准文档流，即文档流中没有这个元素，

           fixed       :     固定定位，不收任何元素的影响

           inherit    :     继承，继承父元素的定位属性，若父元素是relative 则其也是relative

——HTML中的2大元素：

块状元素：div、h1-h6、有序无序列表(ol、al、li)、table、P等,块级元素独占一行空间

内联元素: a 、span 、img 、input等，内联元素不独占，统一排列在一行中，空间不足时，才挤压到下一行

—— z-index  :

（1）只作用于 带有定位属性的元素，即设置了 position 为 absolute、relative、fixed、inherit

（2）z-index 大的元素会覆盖 小的元素，z-index 为负值，元素被普通流中的元素覆盖

（3）层级具有继承性，若父元素层级大于相邻元素，即使子元素小于相邻元素层级，它实际表现的层级也大于相邻元素