我有一个通过CSS设置的背景图像.
html {
background-image: url('../img/cello.jpg');
background-attachment: fixed;
background-size: 100%;
}
Run Code Online (Sandbox Code Playgroud)
我计划为网站的不同页面提供不同的背景图像:因此,文本在其上清晰可读非常重要.现在,我在中间的#main内容框中有一个半透明的黑色背景,以确保易读性:
#main {
background: rgba(0, 0, 0, 0.5);
}
Run Code Online (Sandbox Code Playgroud)
然而,我真正想做的是在整个背景图像上都有这种半透明的背景,因为黑盒看起来有点笨重.我已经尝试制作一个<div id=#tint>包含整个HTML文档并给予#tint的rgba(0,0,0,0.5),但这根本不起作用 - 我可以得到任何改变或者我可以得到整个背景变成一个简单的灰色,根本没有可见的背景图像.这根本不可能吗?