我在正文中放了一张背景图片。我的菜单框也有不同的颜色。我不想在菜单框中看到图像,在CSS中怎么做呢?下面是我的代码。
谢谢你,Avi
body{
font-family: sans-serif;
background-image: url("coffee_beans.jpeg");
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
}
.menu{
position: relative;
border: 2px solid red;
max-width: 613px;
width: 100%;
margin: auto;
background-color: rgba(255, 189, 109, 0.395);
}
也许你可以试着去掉background-color的alpha,它不会变成透明的背景。
.menu{
background-color: rgb(255, 189, 109);
}
如果你必须保持背景色为透明,你可以在。menu上再创建一个图层div
body{
font-family: sans-serif;
background-image: url("https://dl.fujifilm-x.com/global/products/cameras/x-t3/sample-images/ff_x_t3_002.JPG");
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
}
.menub{
position: relative;
border: 2px solid red;
max-width: 613px;
width: 100%;
height:100px;
margin: auto;
background-color: white;
}
.menu{
width: 100%;
height:100px;
background-color: rgba(255, 189, 109,0.382);
}
<html>
<body>
<div class="menub">
<div class="menu"></div>
</div>
</body>
</html>