css弹出遮盖层，是我们前端程序员经常经常使用的一个功能，虽然有很多UI框架都带有些功能，但有时仅仅是一个简单的弹出层，却有引入很多CSS，就显得有些笨重了，这时我们可以非常容易的写一个

 <style>
    .mask{
        position: absolute;
        left:0;
        right:0;
        top:0;
        bottom: 0;
        background-color: rgba(0,0,0,.5);
    }
    .test{
        position: absolute;
        width: 300px;
        height: 300px;
        background-color: green;
        left:50%;
        top:50%;
        transform: translate(-150px,-150px);
        text-align: center;
        line-height: 300px;
        color: #fff;
    }
</style>
    <a href="">南昌雅腾</a>
    <div class="mask">
        <div class="test">小猪佩奇,啦啦啦</div>
    </div>

效果如下：