透明背景，不透明元素
透明背景，不透明元素
提问于 2011-10-26 17:15:33
我想在body上有一个图像背景，在main div上有一个半透明的背景，这样图像就可以通过它看到，但有阴影。然而，最简单的
body {
background-image: ...
}
#main {
background-color: #999;
opacity: 0.9
}还会使#main中的所有内容都变得不透明，比如任何包含的img。
你怎么做我所描述的？
谢谢
回答 3
Stack Overflow用户
回答已采纳
发布于 2011-10-26 19:17:46
rgba可以帮助您，但并非所有浏览器都支持rgba
用法：
rgba(a,b,c,d), where a = red(0-255); b = green(0-255); c = blue(0-255), d = alpha opacity(0-1)所以如果你想要一个50%的红色背景，你应该使用
背景: rgba(255,0,0,0.5);
Stack Overflow用户
发布于 2011-10-26 17:21:49
如果可以在项目中使用CSS3，则可以使用rgba()
#main {
background-color: rgba(0, 0, 0, .5)
}语法为rgba(Red，Green，Blue，Alpha)。这将使#main的背景透明，但不会使内容透明。
这里是fiddle：http://jsfiddle.net/neilheinrich/FwxRX/
Stack Overflow用户
发布于 2011-10-26 17:20:28
如果你创建了一个半透明的png文件，大几个像素，颜色是你想要的，然后添加它作为main的背景图像，你应该会得到想要的结果。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/7900757
复制相关文章
相似问题
腾讯云开发者
