问答详情
源自:1-7 曲线阴影

曲线阴影z-index不管用。。。

.jj {
 height:300px;
 height:200px;
 position:relative;
 box-shadow: 0px 1px 4px rgba(0,0,0,0.3),0 0 40px rgba(0,0,0,0.1) inset;
 -moz-box-shadow: 0px 1px 4px rgba(0,0,0,0.3),0 0 40px rgba(0,0,0,0.1) inset;
 -o-box-shadow: 0px 1px 4px rgba(0,0,0,0.3),0 0 40px rgba(0,0,0,0.1) inset;
 -webkit-box-shadow: 0px 1px 4px rgba(0,0,0,0.3),0 0 40px rgba(0,0,0,0.1) inset;
 
}
.jj:after,.jj:before {
 content:'';
 background:#f00;
 position:absolute;
 z-index:-6;
 top:50%;
 bottom:0;
 left:10px;
 right:10px;
 -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
 box-shadow:0 0 20px rgba(0,0,0,0.8);
 -o-box-shadow:0 0 20px rgba(0,0,0,0.8);
 -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
 border-radius:100px/10px;

}

提问者:慕雪3202717 2017-11-01 11:13

个回答

  • 慕虎5488415
    2017-11-02 09:55:39

    .biaoti {
        width:700px;
        height:400px;
        margin: 20px auto;
        position:relative;
        background-color: #FFFFFF;
        text-align: center;
        box-shadow: 0px 1px 4px rgba(0,0,0,0.3),0 0 40px rgba(0,0,0,0.1) inset;
        -moz-box-shadow: 0px 1px 4px rgba(0,0,0,0.3),0 0 40px rgba(0,0,0,0.1) inset;
        -o-box-shadow: 0px 1px 4px rgba(0,0,0,0.3),0 0 40px rgba(0,0,0,0.1) inset;
        -webkit-box-shadow: 0px 1px 4px rgba(0,0,0,0.3),0 0 40px rgba(0,0,0,0.1) inset;
    
    }
    .biaoti:after,.biaoti:before {
        content:'';
        background:#f00;
        position:absolute;
        z-index:-1;
        top:50%;
        bottom:0;
        left:10px;
        right:10px;
        -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
        box-shadow:0 0 20px rgba(0,0,0,0.8);
        -o-box-shadow:0 0 20px rgba(0,0,0,0.8);
        -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
        border-radius:100px/10px;
    }

    如上 已解决 请设置div的背景颜色

  • 慕虎5488415
    2017-11-01 14:28:05

    .jj 没有设置背景颜色,加一个白色试一下

  • 慕虎5488415
    2017-11-01 14:09:00

    z-index的值设为-1就好了啊  没有用么?