CSS的不透明度只能是背景色，而不是文字吗? [英] CSS opacity only to background color, not the text on it?

问题描述

我可以仅将opacity属性分配给div的background属性，而不分配给它的文本吗?

Can I assign the opacity property to the background property of a div only and not to the text on it?

我尝试过:

background: #CCC;
opacity: 0.6;

但这不会改变不透明度.

but this doesn't change the opacity.

推荐答案

听起来您想使用透明背景，在这种情况下，您可以尝试使用

It sounds like you want to use a transparent background, in which case you could try using the rgba() function:

rgba(R, G, B, A)

R(红色)，G(绿色)和B(蓝色)可以是<integer> s或<percentage> s，其中数字255对应于100％. Alpha可以是介于0和1之间的<number>或<percentage>，其中数字1对应于100％(完全不透明).

rgba(R, G, B, A)

R (red), G (green), and B (blue) can be either <integer>s or <percentage>s, where the number 255 corresponds to 100%. A (alpha) can be a <number> between 0 and 1, or a <percentage>, where the number 1 corresponds to 100% (full opacity).

rgba(51, 170, 51, .1)    /*  10% opaque green */ 
rgba(51, 170, 51, .4)    /*  40% opaque green */ 
rgba(51, 170, 51, .7)    /*  70% opaque green */ 
rgba(51, 170, 51,  1)    /* full opaque green */ 

一个小的示例，显示了如何使用rgba.

A small example showing how rgba can be used.

从2018年开始，几乎 每个浏览器都支持rgba语法 .

As of 2018, practically every browser supports the rgba syntax.

这篇关于CSS的不透明度只能是背景色，而不是文字吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！