首先创建一个盒子里面包含播放按钮图片。

<div class="box">
    <img src="./img/play.png" alt="">
  </div>

样式：

.box{
      position: relative;
      width: 450px;
      height: 300px;
      background: url('./img/11.jpg');
      overflow: hidden;
    }

    .box img{
      position: absolute;
      top: 50%;
      left:50%;
      transform: translate(-50%,-50%) scale(7);
      opacity: 0;
      transition: all 0.3s;
    }

鼠标经过缩放效果：

.box:hover img{
    /*当鼠标经过会覆盖原css的居中定位，所以在设置hover时也要加上定位css*/
      transform: translate(-50%,-50%) scale(1);
      opacity: 1;
    }