说到CSS中的复杂布局,那就不得不说position了。
position的各种值会产生什么样的效果,下面会详细说明。
static
static是position的默认值。所以position:static并不会被特殊定位。

static
relative
relative表现和static一样,当然排除了你可能添加了一些额外的属性。在一个position属性上设置了relative的
元素上设置top、right、bottom、和left(向设置的方向远离)的属性会使其偏离正常位置,其他元素不会补齐因位移产生的空白。

relative
absolute
absolute是一个非常有意思的position值。如果设置了绝对定位的元素element1的外层没有设置了relative或者absolute的爹元素,爷爷元素,或者祖宗元素。那么这个element1的元素就是相对于文档的body元素。

absolute
fixed
fixed是一个固定定位,这个元素会相对视窗来定位,所以就算页面滚动,它还是会留在相同位置。和relative一样,top、right、bottom和left属性都可用。
这个例子就不上图了,因为不滚动页面也看不出来。
