Edit in JSFiddle


              
<div class="box">三边的box-shadow</div>
.box{
    width:100px;
    height:200px;
    margin:20px auto;
    position: relative;
    background-color: #fff;
}
.box:before{
    content: "";
    position: absolute;
    z-index: -1; /* 隐藏到box下面 */
    left: 0;
    top: -10px; /* 向上偏移阴影,使其看起来和左右扩展相等 */
    box-shadow:0 10px 20px rgba(0,0,0,0.4);
    width:100%;
    height:100%;
}