css 定位

对于(例如元素div1)position:absolute时，是相对于已定位的最近父元素，如果没有已定位的父元素，则相对于初始包含块（html）

其中这里说的"已定位的父元素"是指position属性为relative,absolute,fixed的元素，如果position的值为static或不存在，则div1则absolute则不相对于该父元素，而是相对于初始包含块。

 

在一个一个框包含另一个框中，

eg:

<div class="one">

<div class="two"></div>

</div> 

 

div.two相对于div.one进行定位，

如果div.two为absolute定位，则不考虑div.one的padding效果。但是会考虑div.two自身的margin效果。

如果div.two为relative定位，是相对与自身进行定位，要考虑div.one的padding效果。 

eg:例如

<style>

.one

{

position:relative;

margin:auto;

width:400px;

height:400px;

border:2px solid blue;

box-sizing:border-box;

}

.two

{

margin:20px;

top:0px;

left:0px;

position:absolute;

width:200px;

height:200px;

border:2px solid red;

}

</style>

 当.two(position:absolute)中的top:0px left:0px 时既使div.one有padding值，但是div.two还是贴着div.one的左上角。但是div.two有margin值时，要考虑margin的效果，div.two的左上角不在贴着div.one的左上角。