Question

下一步如何正确设置背景不透明度：

<body style="background-image: url(images/background.jpg); background-color: white;
 background-position: center center; background-size: 100%; 
 background-repeat: no-repeat">

我尝试：

background-opacity: 0.5;

但是失败了。

应该是这样的：

background-image: url(images/background.jpg) opacity: 0.5;

甚至，

opacity: .4;

不影响图像，但影响文字和整个身体。

不接受使用div的解决方案。

我的网页：http://shell.bshellz.net/~panzerdivision/

浏览器：firefox＆amp;铬

Answer 1

使用opacity属性，更改元素本身的不透明度。

要拥有透明的background-color，您可以使用rgba()作为背景颜色：

background-color: rgba(255, 255, 255, .5);

或者简称：

background: rgba(255, 255, 255, .5) url(path/to/transparent/background.png) center center no-repeat;

但如果您需要透明的背景图片，图片应该本身就是透明的。

顺便说一下，here is a solution为background-image提供不透明度，但我不确定在这种情况下是否有用。

Answer 2

您无法使用CSS设置元素的整个背景的不透明度。

您可以设置整个元素的不透明度（使用opacity属性）。
您可以设置背景颜色的不透明度（使用rgba颜色：background-color: rgba(50%, 50%, 50%, 0.5);）

如果你想要一个半透明的背景图像，你必须在图像本身编码不透明度（使用支持它的PNG或WebP图像格式）。

Answer 3

Use the following code and adjust the width as you want

<p><img style="opacity:0.9;" src="C:\Users\Desktop\images.jpg" width="300" height="231" alt="Image" /></p>

如何在身体风格的一行中正确设置背景不透明度？

3 个答案: