11

为什么 IE 的以下后备color: red;不起作用？
在 IE7 中，颜色是black而不是red.
现场演示在这里

HTML：

<div>
    <span>Hello</span>
</div>

CSS：

div {
    width: 200px;
    height: 100px;
    background-color: blue;
    text-align: center;
}
span {
    font-size: 2em;
    color: red;
    color: rgba(250, 250, 97, 0.9);
}

第三方编辑

css color 上的mozilla mdn列出了不同的选项color: value

  • CSS 2 规范：color: <value>值可以是关键字red或rgb(255,0,0)
  • CSS 颜色模块级别 3（建议 2017-12）添加了 SVG 颜色、rgba()、hsl() 和 hsla() 函数，例如：rgba(0,0,0,0)
4

2 回答 2

11

IE 不支持 RGBA。

但是，当它看到您的颜色：样式时，它会尝试对其进行评估并恢复为默认颜色（#00000000）。您可以在此处使用 IE 特定的 hack，例如

*color: red;

但是，假设您试图只影响背景颜色，而不是整个元素的不透明度，您最好使用将所需 rgba 值设置为渐变的开始和结束颜色的过滤器 - 创建 rgba背景。

filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000050,endColorstr=#99000050);

-ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000050,endColorstr=#99000050);

但请记住 - IE 假定 Alpha 是第一个，而不是最后一个，所以不要只是转换和复制您的值。双重过滤器分别适用于 IE6 和 IE7。

http://css-tricks.com/rgba-browser-support/

于 2010-07-13T11:22:09.490 回答
5

将这两个颜色声明拆分为单独的 CSS 规则集可以解决这个问题：

span {
    font-size: 2em;
    color: red;
}
span {
    color: rgba(250, 250, 97, 0.9);
}

现在 IE 得到红色文本，更好的浏览器得到 RGBA 声明。

于 2013-04-24T15:23:23.067 回答