CSS box-shadow 在同一个 div 上的插入和外部
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7965278/
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 both inset and outside on same div
提问by pahnin
Can't I have both box shadow inner and outer on the same div? I've tried but it doesn't work
我不能在同一个 div 上同时有内框和外框阴影吗？我试过了，但没有用
回答by Misha Reyzlin
You need to use comma to separate both shadows: http://jsfiddle.net/gryzzly/CWuw8/3/You also need to add browser-specific prefixes in order for this to work everywhere it's supported:
您需要使用逗号来分隔两个阴影：http: //jsfiddle.net/gryzzly/CWuw8/3/您还需要添加特定于浏览器的前缀，以便在它支持的任何地方都能正常工作：
div {
-webkit-box-shadow:
10px 10px 10px #000,
inset 0 0 10px #000;
-moz-box-shadow:
10px 10px 10px #000,
inset 0 0 10px #000;
-o-box-shadow:
10px 10px 10px #000,
inset 0 0 10px #000;
box-shadow:
10px 10px 10px #000,
inset 0 0 10px #000;
}
And you must also specify color for you shadow in order for it to be seen.
而且您还必须为阴影指定颜色才能看到它。
回答by 472084
Using CSS3 you can have multple box shadows just by seperating them by commas eg:
使用 CSS3，您只需用逗号分隔即可拥有多个框阴影，例如：
box-shadow: 10px 10px 10px, 0 0 10px inset;
You can have as many as you want.
您可以拥有任意数量的。
回答by Matijs
Updated your fiddle for you: http://jsfiddle.net/CWuw8/4/
为你更新了你的小提琴：http: //jsfiddle.net/CWuw8/4/
