如何使用CSS为文本或图像提供透明背景?

是否可以仅使用CSS使元素的背景半透明,但使元素的内容(文本和图像)不透明

我希望在不将文本和背景作为两个独立元素的情况下完成此任务

尝试时:

p{
位置:绝对位置;
背景颜色:绿色;
过滤器:α(不透明度=60);
不透明度:0.6;
}
跨度{
颜色:白色;
过滤器:α(不透明度=100);
不透明度:1;
}
<p>
<span>你好,世界&lt/span>
&lt/p&gt

看起来子元素受其父元素的不透明度约束,因此opacity:1与父元素的opacity:0.6相对

使用半透明PNG或SVG图像或使用CSS:

背景色:rgba(255,0,0,0.5);

这里有一篇来自css3.info的文章,不透明度、RGBA和折衷(2007-06-03)


<p style=“背景色:rgba(255,0,0,0.5);”>
<span>你好,世界&lt/span>
&lt/p&gt

发表评论