当box-background元素没有给背景颜色时，box-shadow的阴影可以正常显示

<style>.box {height: 100px;line-height: 100px;text-align: center;}.box-shadow {box-shadow: 0 5px 10px -5px #00ff00;}.box-background {}
</style><div class="box box-shadow">box-shadow</div>
<div class="box box-background">box-background</div>

当box-background元素给定一个背景色之后，box-shadow的阴影就没有了

<style>
.box {height: 100px;line-height: 100px;text-align: center;}.box-shadow {box-shadow: 0 5px 10px -5px #00ff00;}.box-background {/* 增加一个背景色 */background-color: #f5f5f5;}
</style><div class="box box-shadow">box-shadow</div>
<div class="box box-background">box-background</div>

解决方法

给box-shadow加一个z-index属性
不行就再加个 position: relative;

"box box-shadow">box-shadow
"box box-background">box-background

css：box-shadow层级问题-相邻元素背景遮盖了阴影