CSS中的 opacity 属性可以设置透明度值,取值范围为0到1之间,包括0和1。其中,0表示完全透明,1表示完全不透明。在实际应用中,我们也可以使用小数来表示不同程度的透明度,如0.5表示半透明状态。
需要注意的是,opacity 属性设置的透明度会影响元素及其内容的透明度。如果只想设置元素的背景透明,可以使用 background-color 属性的 rgba() 值,如 background-color: rgba(255, 255, 255, 0.5) 表示白色半透明背景。
另外,opacity 属性还会影响元素的子元素透明度,如果只想设置子元素的透明度而不影响父元素,可以考虑使用 rgba() 值或者 opacity 属性的值为1的父元素包裹子元素,再设置子元素的透明度,如下所示:
<div style="background-color: rgba(255, 255, 255, 0.5);">
  <p style="opacity: 1;">不透明文本</p>
  <p style="opacity: 0.5;">半透明文本</p>
</div>
其中,第一个 <p> 元素不受父元素的透明度影响,保持完全不透明;而第二个 <p> 元素受到父元素的透明度影响,呈现半透明状态。