IE8 中的不透明度适用于但不在 上

Question

我在使用 IE8 时遇到问题，无法使 元素透明。我发现了这些相关的问题，但我对那里提供的答案没有任何运气：

• 不透明度 CSS 在 IE8 中不起作用
• 网页中的不透明度？

我已经尝试“给出布局”，通过使用 zoom: 1;，但这并没有帮助。这是我的测试 CSS，取自 此页面 上的示例：

.test {
  background-color: #6374AB;
  width: 100%;
  color: #ffffff;
  zoom: 1;
}
.opaque1 {
  opacity: .5;
}
.opaque2 {
  filter: alpha(opacity=50);
}
.opaque3 {
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
}
.opaque4 {
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  filter: alpha(opacity=50);
}

以及测试 HTML ：

<p class="test">Test paragraph without opacity.</p>
<p class="test opaque1">Test paragraph with <code>opacity</code></p>
<p class="test opaque2">Test paragraph with <code>filter</code></p>
<p class="test opaque3">Test paragraph with <code>-ms-filter</code></p>
<p class="test opaque4">Test paragraph with compatibility note</p>

<p>
  <a class="test" href="#">Test anchor without opacity.</a><br/>
  <a class="test opaque1" href="#">Test anchor with <code>opacity</code></a><br/>
  <a class="test opaque2" href="#">Test anchor with <code>filter</code></a><br/>
  <a class="test opaque3" href="#">Test anchor with <code>-ms-filter</code></a><br/>
  <a class="test opaque4" href="#">Test anchor with compatibility note</a><br/>
</p>

在 IE8 中，opaque2、opaque3 和 opaque4 段落是透明的，但没有一个锚点是透明的。在 IE6 中，opaque2 和 opaque4 段落和锚点都具有透明度。

Answer 1

尝试给锚点 display:block，但是你必须修复它的 css 属性，如宽度、高度......等。
但是一旦你给锚点设置了属性display:block，不透明度就会正常工作。

根据评论，您可能会幸运地使用 display: inline-block;zoom:1 - inline-block 适用于 IE8，缩放将针对 IE 6/7。