0

CSS を使用して、ページ全体の背景画像を半透明にするソリューションを探しています。スタックオーバーフローを見ると、次を使用してページ全体の背景画像のソリューションを見つけました。

background-image: url('background.jpg'); 
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;

1 つは半透明効果用で、次を使用します。

.watermark {
position:fixed;
}

.watermark:after {
    background: none no-repeat 0 0 rgba(255, 255, 255, 0.8);
    bottom: 0;
    content: " ";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}

しかし、その両方を解決できる人はいません。この 2 つのソリューションをどのように組み合わせることができますか?

前もって感謝します

4

1 に答える 1

0 
.image{
background-image: url('background.jpg'); 
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
position:relative;
}
.watermark:after {
background-color:rgba(255, 255, 255, 0.8);
content:"";
left: 0;
position: absolute;
top: 0;
height:100%;
width:100%;
}
于 2013-08-21T11:26:06.167 に答える