【问题标题】:How to make semi-transparent background [duplicate]如何制作半透明背景[重复]
【发布时间】:2013-09-06 19:36:35
【问题描述】:

如何在元素中使用 css 制作半透明背景?但内容也不透明?抱歉英语不好。谢谢。

【问题讨论】:

  • 使用opacity css 属性。
  • 你想要半透明的背景色还是图片?
  • 将此添加到您的 CSS background-color:rgba(255,0,0,0.5)。增加或减少0.5 以降低或提高不透明度。
  • @MarsOne 如果他想要一个半透明的背景图像,那是一个完全不同的问题
  • @Mr_Green: opacity 会影响元素的所有内容,而不仅仅是背景。

标签: html css


【解决方案1】:

使用 rgba 背景。

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

值依次为红色强度、绿色强度、蓝色强度

十进制值是不透明度,从0到1。

如果您需要在没有太多困难的情况下自定义它,请查看:css3 maker

【讨论】:

  • 如果你说的元素不是文档的body,也可以使用opacity:(decimal from 0 to 1)
  • @jCuber:如果它不包含图像以外的任何内容,您的意思是。但是,如果您在容器上设置 opacity: 50%,它也会淡出所有元素的内容。
  • @cHao 啊,好点子。无论如何, opacity 属性在某些情况下也很有用:)
  • @jCuber:就是这样。即使在这种情况下,您也可能拥有一个绝对定位和 z 索引的 :before 伪元素,并设置 its 不透明度而不是容器的不透明度。但这可能是多虑了。 :P
猜你喜欢
  • 2011-06-15
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-12-09
  • 2023-03-23
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多