IE 和 FF 中的 CSS 背景颜色不同答案

【问题标题】：CSS backgroung color is differnt in IE vs FFIE 和 FF 中的 CSS 背景颜色不同
【发布时间】：2011-09-20 19:55:30
【问题描述】：

在 FF 中，它按预期工作（在图像底部放置浅色透明色带作为标题）。但在 IE 中它是完全黑色的（标题确实显示）

.caption {
    z-index:30;
    position:absolute;
    bottom:-35px;
    left:0;
    height:30px;
    padding:5px 20px 0 20px;
    background:#000;
    background:rgba(0,0,0,.5);  
    width:300px;
    font-size:1.0em;
    line-height:1.33;
    color:#fff;
    border-top:1px solid #000;
    text-shadow:none;
}

【问题讨论】：

你确定 IE 支持 background:rgba() 吗？
改用背景色。另外，你有两个背景属性
@zak：背景颜色没有帮助

标签： css

【解决方案1】：

从技术上讲，它不应该在任何一个中工作，第二个会优先。你可以尝试删除“背景：#000;”看看这是否有效？

你也可以试试JQUERY来得到你想要的效果。 http://iamnotagoodartist.com/how-to/semi-transparent-mockup-overlays-with-css-jquery-ui/

【讨论】：

我拿出了整个背景：#000。 FF 的行为是透明的（就像我打算的那样）。 IE现在有清晰的背景了。

【解决方案2】：

那是因为如果您正在测试的 IE 版本（假设它是 7 或 8）使用此值 background:#000; 而不是 background:rgba(0,0,0,.5);，因为它不支持 rgba 并且将其视为无效值，因此它是没有被分配。

编辑：值得注意的是，以这种方式分配背景颜色意味着在不支持 rgba 的旧版浏览器（特别是 IE 6,7 和 8）上，您可以使用备用颜色。

【讨论】：

假设 IE7/8，你是对的。见：stackoverflow.com/questions/6446795/…
@Mike Ozark: IE9 supports rgba. 无论出于何种原因，您的页面都不得处于 IE9 标准模式。按 F12 调出开发者工具 - 它说什么？
我认为这可能是语法错误，IE 9 可能需要 0.5 而不是 .5，但事实并非如此。检查你的 CSS 的其余部分，看看你是否以某种 IE 特定的方式覆盖它。编辑 - 阅读您对 ProNeticas 的评论，听起来 30 点可能是对的。

【解决方案3】：

只是我的意见，但我建议使用“背景颜色”属性而不是“背景”。这可能是个问题

【讨论】：

那不会有任何区别。
我试过 background-color:rgba(0,0,0,.5); FF好，IE清晰

【解决方案4】：

9 之前的任何版本的 IE 都不支持 rgba() 因此它选择其他背景作为后备。本文可能对您有所帮助：http://dimox.net/cross-browser-rgba-support/

这是一个合理的解决方案：http://css-tricks.com/2151-rgba-browser-support/

【讨论】：

我用过这个，似乎在 IE 中工作，也不会弄乱 FF。但是，rgba(0,0,00.5) 的 HEX 是什么
过滤器：progid:DXImageTransform.Microsoft.gradient(startColorstr=#7FFFCC00,endColorstr=#7FFFCC00);这个 8 位十六进制数是什么？
如果我理解你的意思，十六进制值应该类似于 #AA000000 - AA 是 alpha 值，你可能必须使用这些值才能得到你想要的。