有没有办法让一个div HTML元素变成半透明的？
9w11ddsr1#
使用CSS，这是跨浏览器解决方案
div { opacity: 0.5; filter: alpha(opacity = 0.5); filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.5);}
div {
opacity: 0.5;
filter: alpha(opacity = 0.5);
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.5);
}
字符串注意：现在在每一个浏览器中，你只需要opacity，参见CanIUse。它甚至在IE9中也可以工作。
opacity
jum4pzuy2#
这将适用于所有浏览器
div { -khtml-opacity:.50; -moz-opacity:.50; -ms-filter:”alpha(opacity=50)”; filter:alpha(opacity=50); filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.5); opacity:.50; }
-khtml-opacity:.50;
-moz-opacity:.50;
-ms-filter:”alpha(opacity=50)”;
filter:alpha(opacity=50);
opacity:.50;
字符串如果您不希望透明度影响整个容器及其子容器，请检查此解决方法http://www.impressivewebs.com/css-opacity-that-doesnt-affect-child-elements/
qzlgjiam3#
使用一个背景PNG文件，这是半透明的，并希望你不必支持IE6？
p4rjhz4m4#
如果你只想要div的background是半透明的，而不是里面的任何文本和元素，你可以简单地将background-color设置为一个半透明的（即alpha < 1）。一个例子是our website，这里是一个最小化的例子：
<html><head> <title>Transparency test</title> <style type="text/css"> body { background-image: url(http://www.fencing-game.de/style/background6.png); } #trans { background-color: rgba(255,0,0,0.5); max-width: 80ex; } p { max-width: 70ex; margin: auto; } #nontrans { background-color: rgb(255,255, 0); } </style></head><body> <div id="trans"> <p>normal text</p> <p id="nontrans">nontransparent</p> <p>normal text</p> </div></body>
<html>
<head>
<title>Transparency test</title>
<style type="text/css">
body {
background-image: url(http://www.fencing-game.de/style/background6.png);
#trans {
background-color: rgba(255,0,0,0.5);
max-width: 80ex;
p {
max-width: 70ex;
margin: auto;
#nontrans {
background-color: rgb(255,255, 0);
</style>
</head>
<body>
<div id="trans">
<p>normal text</p>
<p id="nontrans">nontransparent</p>
</div>
</body>
字符串
4条答案
按热度按时间9w11ddsr1#
使用CSS，这是跨浏览器解决方案
字符串
注意：现在在每一个浏览器中，你只需要
opacity，参见CanIUse。它甚至在IE9中也可以工作。jum4pzuy2#
这将适用于所有浏览器
字符串
如果您不希望透明度影响整个容器及其子容器，请检查此解决方法http://www.impressivewebs.com/css-opacity-that-doesnt-affect-child-elements/
qzlgjiam3#
使用一个背景PNG文件，这是半透明的，并希望你不必支持IE6？
p4rjhz4m4#
如果你只想要div的background是半透明的，而不是里面的任何文本和元素，你可以简单地将background-color设置为一个半透明的（即alpha < 1）。
一个例子是our website，这里是一个最小化的例子：
字符串