定位

一）元素的定位属性

元素的定位属性主要包括定位模式和边偏移两部分。

1.边偏移

top、bottom、left、right，分别是元素父元素各个位置边线距离。

当然每次只能使用其中两个，比如top,left。

2.定位模式

在CSS中，position属性用于定义元素的定位模式，语法：position: static | relative | absolute | fixed

1）静态定位（static）

静态定位是所有元素的默认定位方式，是各个元素在html文档流中的默认位置。其实就是标准流的特性。

2）相对定位(relative)

以自己的左上角为基准点进行移动。移动后不会脱标。

3）绝对定位（absolute）

绝对定位跟浮动一样，不占位置。

父级元素无定位时：基准点：当前屏幕，与父元素完全无关。

父级元素有定位时：依据最近的已经定位的父级元素（绝对、固定或相对）的父元素（祖父）进行定位。

注意：加了定位和浮动的盒子margin: 0 auto;会失效。此时怎么让盒子居中对齐呢？

用绝对定位left:50%  然后margin-left自己的一半

4）固定定位（fixed）

固定定位是绝对定位的一种特殊形式，它以浏览器窗口作为参照物来定义网页元素。

注意：跟浮动一样元素添加了绝对定位与固定定位后，元素会转换为行内块。

二）叠放次序（z-index）

当对多个元素同时定位时，定位元素之间可能会发生重叠。

在CSS中想要想要调整重叠元素的堆叠顺序，可以使用z-index。

取值越大越在上面。

原文地址：https://www.cnblogs.com/Shadowplay/p/11013777.html