Question

我想使用透明度来查看背景图片。

我正在使用html：

body{
    background-image:url("000000000.jpg");
    background-attachment:fixed;
}

这里0是 body ，1是 div 高于正文，2是另一个 div 高于第一个div。

0000000000000000000000000
0000000000000000000000000
0000000111111111110000000
0000000111111222110000000
0000000111111222110000000
0000000111111111110000000
0000000000000000000000000
0000000000000000000000000

我想使用透明度来看几个div相互叠加时的背景。

我的问题是“2”，我仍然可以在透明度中看到1（如果1和2包含文本则不可读）。

我怎样才能在css中避免这种情况？

body{
    color: #fff;
    background-color: #333;
}
#div1{
    border:1px solid #fff;
    background-color: transparent !important;
}
#div2{
    position: absolute;
    top: 50px;
    left: 50px;
  border: 1px solid yellow;
  background-color: transparent !important;
}

<html>
<body>
  <div id="div1">111111111111111111111111111 <br>111111111111111111111111111
<br>111111111111111111111111111
<br>111111111111111111111111111
<br>111111111111111111111111111
<br>111111111111111111111111111</div>
  <div id="div2">22222<br>22222</div>
</body>
</html>

基于元素位置的背景

0 个答案: