主页 > 网站建设 >

IE7 设置z-index的覆盖问题的解决方法

网站建设 2023-01-28 21:39www.1681989.com免费网站

在IE7及之前的版本中设置z-dex的属性，确没有生效，查阅写资料，发现主要的结果和处理方法为

父级元素若设置为position:relative时候，则子级元素的z-dex属性会被覆盖

如

复制代码

代码如下:

<div style="position:relative;">
<div style="position:absolute;z-dex:100;width:100px;height:100px;background:red;"></div>
</div>
<div style="position:relative;">
<div style="position:absolute;z-dex:10;width:20px;height:20px;background:black;"></div>
</div>

在这种情况下，无论第一个red的z-dex设置多高，都是会被第二个black所覆盖的

解决的方案为，设置父级元素的z-dex

复制代码

代码如下:

<div style="position:relative;z-dex:2;">
<div style="position:absolute;z-dex:100;width:100px;height:100px;background:red;"></div>
</div>
<div style="position:relative;z-dex:1;">
<div style="position:absolute;z-dex:10;width:20px;height:20px;background:black;"></div>
</div>

这样，red就会覆盖black

上一篇：CSS2中从优先权重的计算方式来辨别下CSS 下一篇：CSS中position定位的个熟悉示例介绍

Copyright © 2016-2025 www.1681989.com 推火网版权所有 Power by