CSS中的z-index属性基本使用教程

.b{position:relative;margin:-70px 0 0 30px;background:#090;}   

.c{position:relative;margin:-70px 0 0 60px;background:#f00;}   

.d{position:absolute;z-index:99;height:50px;background:#090;}  

你会发现虽然 a 的子元素 d 将 z-index 定义为99，但 d 仍然无法遮住 b 和 c 元素，这是因为 a 创建了新的局部层叠上下文，d 元素无法超越父级。

需要注意的是，此时就算 a 元素变成了定位元素，也不能改变其会创建新局部层叠上下文的命运，因为他设置了 opacity:.8。

按照我们前文所说，如果 a 没有定义 opacity:.8 ，但却像 b 和 c 元素一样设置了 relative，那么其子元素 d 将可以覆盖 b 和 c，至于这个例子就不再奉上了，大家随便写个测试一下即可。

（编辑：焦作站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!