利用display：none和display：blocks设置鼠标经过的一个效果。
注意的几个点：1.子绝父相定位 2.设置百分比宽高 3.播放按钮放用背景图做 4.a:hover .mask的写法
<body> <div class="tu"> <a href="#"> <img src="tu.png" alt=""> <div class="mask"></div> </a> </div> </body>
<style> .tu { width: 442px; height: 318px; position: relative; } .mask { width: 100%; height: 100%; background: rgba(66, 49, 49, 0.57) url("bo.png") no-repeat center; position: absolute; top: 0; left: 0; display: none; } a:hover .mask{ display: block; } </style>