如何实现css的页面背景图片透明化而不影响文字内容
索奥歌者:
不过我最后找到了另一个类似的写法,没有这个问题
分享一下代码(我这里是给table表格设置半透明背景,因为表格中有图片,希望背景半透明,好看一点)[code=css]
#myTable::before {
content: "";
background-image: url("../../images/cldj_bg.jpg");
background-size: 1539px 871px;
background-repeat: no-repeat;
width: 1539px;
height: 871px;
position: absolute;
top: 0px;
left: 0px;
opacity: 0.4;
z-index: -1;
}
#myTable {
position: relative;
width: 1539px;
height: 871px;
box-shadow: 10px 10px 5px #888;
border: 1px solid #666;
}
[/code]
最终效果可以看看这里:https://soulgazer.gitee.io/tooys-game/web/Genshin_Impact_Tooys/box-record.html
|