IE8不透明度不起作用[重复]

Posted 2023-03-06

【中文标题】IE8不透明度不起作用[重复]

【英文标题】：IE8 Opacity Not Working [duplicate]

【发布时间】：2012-03-26 12:05:46

【问题描述】：

可能重复：Opacity CSS not working in IE8

所以我一直试图让不透明度在 IE8 中工作（不是真正的 IE8，更像 IE9 中的 IE8 浏览器模式），并且由于某种原因，不透明度没有得到应用。这是我为 CSS 准备的内容。

    nav a:hover 
    color: #fff;
    background: none;


nav a:hover:after 
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1;
    background: #fff;
    content: '';
    /* IE8 Sucks Balls */
    opacity: 0.10;
    filter: alpha(opacity=10);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=10);
    display: block;
    zoom: 1;

【问题讨论】：

你在什么地方应用不透明度？ :after 怎么了？

IE8 及以下至少确实会吸球。您是否尝试过仅使用 alpha 过滤器而不使用其他两个过滤器？

@cale_b：这是一个不同的问题。他的风格有布局。通知zoom: 1;

【参考方案1】：

这可能只是因为您处于兼容性视图中。但我对此表示怀疑。

无论如何，我认为这可能是因为您将背景设置为白色，并且您正在使用诸如低不透明度之类的事实。我会将背景设置为#000，不透明度设置为 0.8，以确保这不是问题。也像乔斯夫说的。我不知道这是在做什么，nav a:hover:after

此工具也适用于检查旧版浏览器。 （在一定程度上）。

http://www.my-debugbar.com/wiki/IETester/HomePage

如果是我，我只会使用透明 png 作为背景。我会进入 Photoshop 制作一个 1x1 黑色正方形，将不透明度设置为 10%，然后将其保存为 png。

#myelement 
background-image:url('mytransparentbg.png');

【讨论】：

如果我无法修复它，这对我来说是最后的手段，因为我倾向于尽可能避免使用图像。

【参考方案2】：

我敢打赌，它不起作用是因为您使用的是 IE8 模式下的 IE9 不支持的 html5 nav 标签。虽然它在普通 IE9 模式下支持它。

编辑。 This article 和链接的特定部分是必须阅读的，当在不支持它们的浏览器中使用 HTML5 元素时。

【讨论】：

我正在使用 html5shiv，所以这应该不是问题。