CSS 跨浏览器CSS透明背景颜色

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了CSS 跨浏览器CSS透明背景颜色相关的知识，希望对你有一定的参考价值。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Cross-Browser CSS Background Transparency</title>
<style type="text/css">
body { font-family:Arial, Helvetica, sans-serif; }
.flower {color:#FFF; background-image:url(http://farm5.static.flickr.com/4114/4762615378_b092626018.jpg); width:440px; height:313px; padding:10px;}
.color-block {
	padding:35px;
	background-color: #ff0000;
	background-color: rgba(255, 0, 0, 0.5); 
}

</style>
<!--[if IE]>
<style type="text/css">

.color-block {
   background:transparent;
   filter:progid:DXImageTransform.Microsoft.Gradient(
                                                GradientType=0, 
                                                startColorstr=#7fff0000, /* first two digits are a hex value [0-255] for transparency (7F = 50% Opacity. FF = 100% Opacity. 00 = 0% Opacity. ) */
                                                endColorstr=#7Fff0000
                                            );
   zoom: 1;
} 



</style>
<![endif]-->
</head>

<body><div class="flower">
<div class="color-block"><strong>CSS Transparent Background Color</strong><br />This box has a semi-transparent background, but it's content is fully opaque </div></div>
</body>
</html>

以上是关于CSS 跨浏览器CSS透明背景颜色的主要内容，如果未能解决你的问题，请参考以下文章

scss 跨浏览器alpha透明背景CSS（rgba）

Html表格背景颜色透明度怎么调，只用HTML和css

css在灰色透明的背景下，如何才能使上面的字的颜色为白色？

css怎样仅设置div元素背景透明度，而不设置div元素里面元素的透明度

文本框中的透明文本（css、js、jquery）

如何用css去掉a标签点击时的背景色？