理解css定位

       CSS中，style为样式，div为结构，高度宽度形成div，我们把它叫做盒子。

       内容(content)、填充(padding)、边框(border)、边界(margin)， CSS盒子模式都具备这些属性。这四个东西，共同组成了盒模型。

       在CSS中使用绝对定位之后，对象就和文档流分离开来，自成一层，不会占用其他同位置div的空间，如果有多个绝对定位层叠的对象，可以用z-index来调整先后顺序，数字越大，等级越靠前。

 

绝对定位（absolute）：

01

.div1{

02	width:50px;

03	height:50px;

04	position:absolute;

05	top:100px;

06	left:100px;

07	z-index:1;

08

}

09

10

.div2{

11	width:50px;

12	height:50px;

13	position:absolute;

14	top:100px;

15	left:100px;

16	z-index:2;

17

}

 //此时两个div层叠，使用z-index控制先后顺序，div1在div2的下面！ 

相对定位（relative）： 偏移出了文档流，始终没有独立出去。位置会被保留。

ps:父类继承与崩塌：http://my.oschina.net/JoeUI/blog/136746

 

转载于:https://my.oschina.net/u/1865859/blog/291226