This question already has answers here:
Opacity of background-color, but not the text [duplicate]
(5个答案)
4年前关闭。
如何降低导航栏中标签背景的不透明度,而又不影响标签本身中的文本?
例如,文本“关于我们”的不透明度为1,但背景色的不透明度为0.5。
这是我的CSS代码。
(5个答案)
4年前关闭。
如何降低导航栏中标签背景的不透明度,而又不影响标签本身中的文本?
例如,文本“关于我们”的不透明度为1,但背景色的不透明度为0.5。
这是我的CSS代码。
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus{
color: #FFFFFF;
background-color: #009eff;
}
最佳答案
您应该对颜色使用rgba
格式,而不要使用hex
。采用:background-color: rgba(0, 158, 255, 0.5);
这是Mozilla Developer网站上rgba
的定义:
可以使用以下命令在“红-绿-蓝-alpha”模型(RGBa)中定义颜色
rgba()功能符号。 RGBa将RGB颜色模型扩展为
包括Alpha通道,从而可以指定a的不透明度
颜色。
a表示不透明度:0 =透明; 1 =不透明;
关于css - CSS更改标签背景的不透明度,而不会影响标签上的文字,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/32670212/