我有一个位置设置为绝对的 div，里面有几个 div。只要我向该 div 添加不透明度过滤器，即使不透明度设置为 100，子 div 也会在 IE7 中消失。
即使没有绝对位置，如果我通过 jQuery 更改不透明度，也会发生同样的事情。
有人知道解决办法吗？
提前致谢
例子
<style type="text/css">
#wrap {
opacity: 0.5; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(Opacity=50); -moz-opacity: 0.50; -khtml-opacity: 0.5;
position:absolute;
}
#sub1 {
position:absolute;
width:200px;
height:200px;
background-color:#F00;
}
</style>
<div id="wrap">
<div id="sub1"></div>
</div>
如果 wrap 有不透明度和绝对位置，则 sub1 在 IE7 中是不可见的
第二种情况:
#wrap {
position:absolute;
width:500px;
height:500px;
color:#fff;
filter: alpha(Opacity=100);
}
#sub1 {
position:absolute;
}
#sub2_bg {
width:500px;
height:500px;
background-color:#000;
position:absolute;
filter: alpha(Opacity=50);
}
#sub2_text {
position:absolute;
}
</style>
<div id="wrap">
<div id="sub1">
<div id="sub2_bg"></div>
<div id="sub2_text">sample text</div>
</div>
</div>
在这种情况下，sub2_text 中的文本“sample text”在 wrap 具有过滤器时具有 50% 的 alpha 透明度，即使它的 opacity=100。显然我可以删除 alpha(opacity=100) 但是当我将 wrap 的不透明度动画化为 .5 并返回到 1 时会出现同样的问题，因为这样 div 就会得到一个过滤器。我注意到只有下面具有 alpha 透明 div 的部分才会出现此问题，如果文本大于 sub1_bg，则只有 sub1_bg 顶部的部分会受到影响。同样仅在 IE 7 中。
如果有人也可以向我展示解决该问题的方法，那就太好了。谢谢。
最佳答案
原因是因为#wrap 现在不再包含您的绝对定位元素。您应该像下面这样指定宽度/高度。
#wrap {
width:500px;
height:500px;
}
以前 #wrap 不会切断该内容，但当您应用过滤器时，它会切断该内容。这就像在你的 #wrap 上粘贴一个 overflow:hidden。
更新: 要修复此问题，请在您的页面上设置严格的文档类型。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
另外，在CSS中添加以下内容，让您的 child 继承之前不透明度50%的滤镜样式。
filter:inherit;
关于jquery - IE 7 - 当为具有绝对位置的 DIV 设置不透明度时，它的子 div 消失，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7364078/