如何制作半透明背景

Question

如何在

元素中使用CSS制作半透明背景？但是，

中的内容不应该是透明的。抱歉我的英语不好。谢谢。

- Agi Maulana

---

使用 opacity CSS 属性。 - Mr_Green

你想要半透明的背景颜色还是图片？ - Itay

将以下代码添加到您的CSS中：background-color: rgba(255,0,0,0.5)。增加或减少0.5以降低或提高不透明度。 - Xareyo

@MarsOne 如果他想要一个半透明的背景图片，那就是完全不同的问题了。 - Itay

@Mr_Green：opacity 会影响元素的所有内容，而不仅仅是背景。 - cHao

Answer 1

使用 rgba 背景。

background: rgba(0, 0, 0, 0.5);

数值按照红色强度、绿色强度、蓝色强度的顺序排列。

小数值表示不透明度，从0到1变化。

如果需要轻松自定义，请查看：CSS3 Maker

- Morrisda

---

如果你所讨论的元素不是文档的 body，你也可以使用 opacity:(0到1之间的小数)。 - cbr

@jCuber：如果它除了图像以外没有包含任何其他内容，你的意思是这样吧。但是，如果你在容器上设置opacity: 50%，那么它也会淡化元素的所有内容。 - cHao

@cHao 哦，说得好。无论如何，不透明度属性在某些情况下也很有用 :) - cbr

@jCuber：确实如此。即使在这种情况下，您可能也可以使用 :before 伪元素进行绝对定位和 z-index，并设置 它的 不透明度而不是容器的。但那可能是过度思考了。 :P - cHao