CSS 仅底部的框阴影
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12798902/
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
Box shadow for bottom side only
提问by Prabhu
I have an box of content and need to give shadow for that. But I want to give shadow for the bottom of the box only. I used this css box-shadow: 0 3px 5px #000000;
我有一盒内容，需要为此提供阴影。但我只想为盒子底部提供阴影。我用过这个css box-shadow: 0 3px 5px #000000;
If i give this code it shows left,right and bottom. I need bottom only
如果我给出这个代码，它会显示左、右和底部。我只需要底部
Can any one suggest to solve this one. Thanks a lot
任何人都可以建议解决这个问题。非常感谢
回答by Riz
回答by Fizer Khan
You have to specify negative spreadin the box shadow to remove side shadow
您必须negative spread在框阴影中指定以删除侧影
-webkit-box-shadow: 0 10px 10px -10px #000000;
-moz-box-shadow: 0 10px 10px -10px #000000;
box-shadow: 0 10px 10px -10px #000000;
Check out http://dabblet.com/gist/9532817and try changing properties and know how it behaves
查看http://dabblet.com/gist/9532817并尝试更改属性并了解它的行为方式
回答by Sudip Pal
Try using online generator css3.meChange the value and get the code, pretty simple.
尝试使用在线生成器css3.me更改值并获取代码，非常简单。
回答by Alcides Queiroz Aguiar
-webkit-box-shadow: 0 3px 5px -3px #000;
-moz-box-shadow: 0 3px 5px -3px #000;
box-shadow: 0 3px 5px -3px #000;
回答by alireza
Specify negative value to spread value. This works for me:
指定负值以传播值。这对我有用：
box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.1);
