我的盒子阴影中有一个奇怪的行为。
在我的代码中我有这个:
-moz-box-shadow: 0 0 3px 3px #d1d3da;
-webkit-box-shadow: 0 0 3px 3px #d1d3da;
box-shadow: 0 0 3px 3px #d1d3da;
这很好用，但是当我使用
为标题栏添加背景图像时 background: #e7ebf4 url('http://imageshack.com/a/img673/4873/qv8bpR.png') repeat-x;
阴影有区别
例子可以在 http://jsfiddle.net/wouterdr/1txww2ps/
带有深蓝色条的部分具有更小/更亮的阴影。另一部分有更大的影子。
我们希望在整个 div 上有相同的阴影(最好是浅蓝色部分旁边的阴影。
非常感谢!
最佳答案
你可以使用两个或多个用 , 分隔的框阴影，如下所示:
-moz-box-shadow: 0 0 3px 3px #d1d3da, 0 0 5px 2px #fff;
-webkit-box-shadow: 0 0 3px 3px #d1d3da, 0 0 5px 2px #fff;
box-shadow: 0 0 3px 3px #d1d3da, 0 0 5px 2px #fff;
您还可以通过在语法末尾添加 inset 来使用 inner box-shadow 并创建您想要的所有内容。(即 0 0 5px 2px #fff inset )
关于html - 方框阴影 : different shadow in same div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27703766/