改变背景图像的不透明度

我正在做一个由3个html页面组成的国家的项目，我决定把国家的国旗图像作为每个页面的背景图像。改变背景图像的不透明度

我想改变的背景图像的不透明度，但每次我尝试做它改变页面的所有其他内容的不透明度 - 文本，标题，等等等等

我有这行代码在我的HTML：

<body background="flag.jpg">

然后在我的CSS我尝试了各种各样的东西。我曾试图给该标签的“身份证”像标志，然后尝试：

#flag { 
     opacity: 0.2; 
}

我也试着只用“背景”，而不是使用“身份证”。

我一直想弄清楚一段时间，不能得到它，任何意见将不胜感激！谢谢。

来源

2017-02-24 Conor

https://css-tricks.com/snippets/css/transparent-background-images/因为你不能做到这一点的方式你试图 –

添加与#flag另一ELEMENTI，这将是“背景”，例如

<body> 
    <div id="flag"></div> 
</body>

和风格与标志

#flag { 
    background-image: url("flag.jpg"); 
    background-position: top center; 
    background-repeat:no-repeat; 
    opacity: 0.2; 
    position:absolute; 
    width:100%; 
    height:100%; 
}

来源

2017-02-24 15:19:58 TriForce

太棒了，非常感谢你！那么标签会进入div标签之间吗？ – Conor

body是主要的html /网站标签，你可以对它应用样式，但是我个人从不接触身体，我在里面做了更多的容器......所以主要的父母是身体。如果你将样式设置为body（不透明度，宽度，高度，字体样式等等），则所有内容都将被继承到 – TriForce

不能使用不透明这样。

一个解决方案是使用背景渐变是这样的：

background: linear-gradient(rgba(93, 41, 28, 0.8), rgba(93, 41, 28, 0.8)), url(https://images.pexels.com/photos/31044/pexels-photo-31044.jpg) fixed;

来源

2017-02-24 15:25:13 thevangelist

内的元素，这些元素不是非常有用，因为你不能设置透明背景颜色......另一件事，如果你对身体设置不透明度，那么里面的所有东西都会有这样的不透明度。 – TriForce

改变背景图像的不透明度

回答

相关问题