遮罩层

<style>

.tanchuang_box .zhezhaoceng{position:absolute;top:0;width:100%;height:100%;background:#000;opacity: 0.2;}

.tanchuang_box .xiangqing{position:absolute;top:16%;left:10%;width:80%;box-sizing: border-box;}

.xiangqing{background:#fff;}

</style>

<div class="tanchuang_box">

<div class="zhezhaoceng"></div>

<div class="xiangqing">

<h1>弹窗标题< img src="images/guanbi.png" /></h1>

<p>内容</p >

</div>

</div>

<script>

$(document).ready(function() {

$(".tanchuang_box").hide()

$(".xiangqing img").click(function(){

$(".tanchuang_box").hide()

})

})

</script>