给背景图片加颜色遮罩

原理： 利用定位，将透明颜色加到图片上

html

<div class="box"></div>

css

.box {
        height: 700px;
        background: url("img/1.jpg") center center no-repeat;
        background-size: cover;
        position: relative;
    }
    .box:after {
        width: 100%;
        height: 100%;
       //  content属性不能少，不然after属性就不起作用了
        content: '';
        position: absolute;
        top: 0
        left: 0;
        background-color: rgba(0, 0, 0, .4);
        z-index: 1;
    }