遮罩（点击阴影部分才隐藏）

<!--遮罩-->
<div class="dialog">
    <div class="dialog-contain">
        <div class="dialog-texts">
            <div class="dialog-header">
            </div>
            <div class="dialog-center">
            </div>
            <div class="dialog-footer">
            </div>
        </div>
    </div>
</div>

.dialog{
    display: none;
    background: rgba(0, 0, 0, 0.7);
    position: fixed;
    top: 0px;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 9;
    font-size:1.6rem;
    .dialog-contain{
        width: 30%;
        height:50%;
        overflow: hidden;
        background: white;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        padding:2rem;
        .dialog-texts{
            height:100%;
            overflow-y: auto;
        }
    }
}

$(".dialog").click(function(){
    $(this).hide();
})

$(".dialog .dialog-contain").on("click",function(e){
    e.stopPropagation();
})