【问题标题】: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 值,你可能必须使用这些值才能得到你想要的。
猜你喜欢
  • 2011-04-29
  • 2017-03-12
  • 2017-12-04
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-05-06
相关资源
最近更新 更多