jquery+css 实现遮罩层

css代码

<style type="text/css">
	.modal{
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.6);
	}
	.modal-content{
		width: 100%;
		max-width: 500px;
		padding: 20px;
		border-radius: 10px;
		margin: 0 auto;
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%,-50%);
		background: #fff;			
	}
	.close{
		width: 20px;
		border-radius: 50%;
		position: absolute;
		right: 20px;
		top: 20px;
		background: #ccc;
		text-align: center;
		cursor: pointer;
	}
</style>

dom元素

<div class="modal">
	<div class="modal-content">				
		<div class="close">x</div>
		<h3>质优平台全面介绍，多方扶持未来可期<br>交易大咖助阵，多角度发散引交易登高<br>圆桌交流聚力，神秘大礼待出</h3>
	</div>
</div>

js代码

<script>
	$(function(){
		$(".close,.modal").click(function(){
			$(".modal").hide()
		})
	})
</script>