CSS 是否可以在 CSS3 box-shadow 中设置透明度？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5458716/
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
提示：将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间：2020-08-30 00:03:32 来源:igfitidea点击:
Is it possible to set transparency in CSS3 box-shadow?
提问by Steven
Is it possible to set transparency on the box shadow?
是否可以在框阴影上设置透明度？
This is my code:
这是我的代码：
box-shadow:10px 10px 10px #000;
-webkit-box-shadow:10px 10px 10px #000;
-moz-box-shadow: 10px 10px 10px #000;
回答by BoltClock
I suppose rgba()would work here. After all, browser support for both box-shadowand rgba()is roughly the same.
我想rgba()会在这里工作。毕竟，浏览器对两者的支持box-shadow和rgba()大致相同。
/* 50% black box shadow */
box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
div {
width: 200px;
height: 50px;
line-height: 50px;
text-align: center;
color: white;
background-color: red;
margin: 10px;
}
div.a {
box-shadow: 10px 10px 10px #000;
}
div.b {
box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
}<div class="a">100% black shadow</div>
<div class="b">50% black shadow</div>