你对position的了解有多少？ - jerrylsxu(2)_H5之家 - 中国HTML5教程资源分享第一站

　　2.Margin 不会在绝对元素上折叠。假设你具有一个 margin-bottom 为20px的段落。在段落后面是一个具有30px的 margin-top 的图片。那么段落和图片之间的空间不会是50px（20px+30px）而是30px（30px > 20px）。这就是所谓的 margin-collapse，两个 margin 会合并（折叠）成一个 margin。

　　绝对定位元素不会像那样进行 margin 的折叠。这会使它们跟预期的不一样。

　　3.IE在 Z-index 上有一些BUG。在IE 6中 select 元素总是处于堆叠层级的最上方而不管它的 z-index 和其他元素的 z-index 是多少。

　　IE 6和IE 7在堆叠层级上又有另外一个问题。IE 6由最外层的定位元素的层级来决定哪一组的元素处于层级的最上面，而不是每一个单独的元素自身的层级决定。

<div>

<p></p>

</div>

<img />

　　对上面这段结构，你会预料段落元素处于堆叠层级的最上方。因为它具有最大的 z-index 值。但在IE 6和IE 7中，图片为处于段落的上方。因为 img 具有比 div 更加高的 z-index 层级。因此它会位于所有 div 的子元素的上方。

　　总结

　　一个元素上所设置的位置属性会根据其中的一种CSS定位模式来运作。你可以为定位元素设置 absolute, relative, fixed, static (默认), 和 inherit 中的其中一个值。

　　定位模式和CSS定位元素，定义了一个盒子在布局中应该处于什么位置以及围绕它的元素会受到定位元素带来的影响。

　　z-index 属性只能被应用与定位元素上。它为页面增加了第三个维度并设置了元素的层级上的顺序。

　　定位属性看起来好像很好理解，但它的运作与它在表面所看到的有点儿不一样。你可能会觉得的是相对定位更加类似绝对定位。当在做布局设计的时候你通常会想使用浮动并在指定的元素上应用定位来打破布局。