我们经常用到页面弹出一个图层，并让下面的显示被遮盖，这个是怎么实现的呢？
<body> <!-- 设置一个遮盖层 --> <div class = "cover"></div> 我有被遮盖了吗？ <a href="https://www.ncyteng.com">南昌雅腾</a> <div class="test"> 我爱大家 </div> </body>
css样式：
/* 遮盖层 样式*/
.cover{
width:100%;
height: 100%;
background: rgba(0, 0, 0, .9);
position: absolute;
left: 0;
top: 0;
z-index: 20;
pointer-events: auto;
/* 遮挡区域不让穿透 */
/* display: none; */
}
.test{
width:200px;
height: 200px;
background: green;
position: fixed;
left: calc(50% - 100px);
top: calc(50% - 100px);
z-index: 200;
display: block;
color: #fff;
padding: 10px;
box-shadow: 0 0 5px 0 #ccc;
}效果如下：
