显示与隐藏

 鼠标经过：

 html

<div class="a">
            <div class="mask"></div>
            <img src="img/22.jpg" alt="">
        </div>

css：

.a{
			 position: relative;
			 width: 347px;
			 height: 216px;
			 background-color: #ffff7f;
			 margin: 100px auto;
			}
.mask{
				/* 隐藏遮罩层 */
				display: none;
				/* 绝对定位: */
				position: absolute;
				width: 100%;
				height: 100%;
				background: rgba(0, 0, 0, .3)  url("img/11.png") no-repeat center;
				
			}
.a:hover .mask{
				display: block;
			}