伪元素中遮罩层的简单使用

在HTML中创建一个div，命名为box，然后在里边再建一个div命名为box1，然后进行如下设置。

.box{

     width: 50px;

     height: 50px;

     background: #333;

     position: relative;

.box{
width:50px;


height:50px;


background:#333;


position: relative;


}


.box1{


    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #fff;
    opacity: 0;
}
.box1:hover{
    opacity: .6;
}

}

.box1{

width: 100%;

height: 100%;

position: absolute;

top: 0;

left: 0;

background: #fff;

opacity: 0;

}

.box1:hover{

opacity: .6;

}