CSS之定位二（偏移属性）

本文我们接着之前的定位话题来开展探讨偏移属性。偏移属性了解起来其实很简单，就是负责告诉浏览器元素相对于父元素的偏移位置。这里要说明两点：1、偏移属性只对定位元素（即position值不是static的元素）有效；2、这里的父元素是之前《css之定位一（position属性）》中谈论的父元素。

偏移属性有top、bottom、left、right四个属性，其属性值各自对应length、percentage、auto、inherit四种（即长度值、百分比、自动、继承）。

定位元素可以包含在父元素里面，也可以在父元素外面（偏移属性值为负）；偏移属性能确定定位元素宽高。这些大家可以自己尝试写下代码测试，在此不做过多的叙述。本文想要探讨两个容易忽略的点：1、当定位元素position值为relative，父元素position值也为relative且定位元素宽高大于父元素宽高是，定位元素对文档布局能否有影响？2、当定位元素设置的宽高与偏移属性所确定的宽高发生冲突时，定位元素的宽高以哪个属性为准？

首先处理第一个问题。由图1我们可以看出：定位元素只是在父元素内部位置发生偏移，对父元素所在的文档流没有造成影响。

图1：定位元素对父元素文档流的影响