Html CSS3 不透明度 - 仅背景
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20036109/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS3 Opacity - background only
提问by user2997822
I wanted to change the opacity of my navigations background color but it also changed the opacity of the links of my navigation. How do I change the opacity of my navigations background color only?
我想更改导航背景颜色的不透明度，但它也更改了导航链接的不透明度。如何仅更改导航背景颜色的不透明度？
This is my style for my navigaton:
这是我的导航风格：
#navigation {
height: 60px;
width: auto;
margin: 0 0 20px 0;
background-color: black;
border-radius: 8px;
opacity: 0.7;
}
#navigation ul {
list-style-type: none;
}
#navigation li {
padding-left: 22px;
float: left;
}
#navigation a {
text-decoration: none;
display: inline-block;
float: left;
padding: 10px 20px 10px 20px;
color: white;
margin-top: 10px;
opacity: 1;
}
#navigation a:hover {
background-color: orange;
border-radius: 10px;
}
回答by C?????N????
You can do it like this:
你可以这样做：
background-color: rgba(0,0,0,0.7);
this changes the background color of black opacity to 0.7 without effecting anything else
这会将黑色不透明度的背景颜色更改为 0.7，而不会影响任何其他内容
回答by Afzaal Ahmad Zeeshan
By using this color:
通过使用这种颜色：
background-color: rgba (0, 0, 0, .5); // black
This way, it will be 50% of the real color!
这样，它将是真实颜色的50％！
It filters alpha object and provides you with the part of the real color with some transparency effect.
它过滤 alpha 对象并为您提供具有一些透明效果的真实颜色部分。
