我想用 CSS 设置几个彼此相邻的样式。我想为背景应用多种颜色,但我希望下方的颜色与不透明度降低的颜色相同,所以我想到了这个:
span.foo{
background-color: rgba(0,0,0,1); /*or whatever*/
color:white;
}
span.foo:last-child{
background-color: rgba(*,*,*,0.5); /*just an example*/
}
所以我想改变已经定义的背景的不透明度,而不影响文本的不透明度,仅通过使用 CSS3。
这可能吗?
最佳答案
我相信没有办法做到这一点。
CSS 本身非常有限,您无能为力。
添加不透明度的唯一方法是:
opacity: 0.5
但以上内容也会影响文本本身,而不仅仅是背景。
但是,您可以将其包装成将背景 block 与文本分开的方式,这样可以保持文本的颜色不变。
编辑:参见 fiddle :http://jsfiddle.net/YfSn7/30/
但这可能看起来有些荒谬,所以我不会给出太多使用它的建议。
如果您真的想让事情变得更简单而不是过于复杂,我猜您将不得不接受这是不可能的。
关于css - 将 alpha channel 添加到给定颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12216572/