为旧浏览器添加替代方法

Question

如何为以下CSS语句添加不透明度？

background: none repeat scroll 0 0 #205081;

css2有可能吗？另外如何从css3中添加不透明度语句呢？

Answer 1

使用 rgba() 。在你的情况下

背景：rgba（32,80,129,1）

最后一个数字是不透明度。 1表示根本没有透明度，0表示不可见。所以，如果你想要50％的不透明，它将是

背景：rgba（32,80,129,0.5）

Answer 2

遗憾的是，由于各种版本和浏览器类型遍布全球，因此没有一个CSS条目在没有JavaScript干预的情况下在所有浏览器上兼容。然而，您可以使用多种样式技术，并使用“if IE 7”HTML来解决不喜欢现代代码的浏览器。

以下是您应考虑的各种方法，以实现跨浏览器的最大兼容性。

为旧浏览器添加替代方法

如果您想在更高版本的Internet Explorer中使用透明背景，那么更简单的方法是使用旧代码为旧版本的浏览器设置样式。您可以通过在

中添加以下代码来过滤样式规则

<head>
</head>

HTML或PHP文件的

部分。

HTML WITHIN HEAD

如果您尚未安装以下代码，则应添加以下代码。现在很多框架和CMS都包含了这个，所以只需在编辑之前查看源代码，只有在不是已经存在的情况下才添加。

<!--[if lt IE 7 ]><html class="ie ie6 no-js" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7 no-js" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8 no-js" lang="en"> <![endif]-->
<!--[if IE 9 ]><html class="ie ie9 no-js" lang="en"> <![endif]-->

制作透明的50％PNG文件

只需加载任何photoshop或任何好的替代品并制作1x1像素的新文件，然后添加新图层并删除背景。然后在图层中填充您要使用的颜色，然后将此图层设置为50％不透明度。然后将其另存为PNG并上传到您的主机。如果您担心页面上的加载时间，那么您可以使用PNGCrush或Smush.it将该PNG压缩到小于0.5kb。

在你的CSS中加上这个（你需要使用IF 7/6等）

.ie6, .ie7, .ie8 .your-div-class-or-id {
    background: transparent;
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=background.png,sizingMethod='scale');
}

}

CSS for Newer Browsers

您应尽可能为较新的浏览器使用较新的代码，并且不使用PNG来提供透明背景，这意味着我们不会通过添加文件提取来增加页面加载时间。只需添加：

background: rgba(32, 80, 129, 0.5)

适用于现代浏览器，如IE9 +，Firefox，Chrome，Safari

您应该同时使用现代和旧版CSS

请注意，您同时使用RGBA和AlphaImageloader这两个CSS元素，因此png文件仅在绝对需要时使用，我知道许多不利于使用带有不透明度的PNG，但在最坏的情况下你只能使用它使用较新的浏览器时不加载它。

如何在背景上添加不透明度？

2 个答案:

为旧浏览器添加替代方法

CSS for Newer Browsers