修改

YouBili_front/src/views/show/IndexView.vue

@@ -20,7 +20,7 @@
             <el-row :gutter="20">
               <el-col v-for="(v,i) of lbList2" :key="i" :span="12">
                 <router-link to="/videoIndex">
-                  <div class="sp_box" @mouseenter="tjPlayVideo(i)" @mouseleave="tjStopVideo(i)">
+                  <div class="sp_box" @mouseenter="tjPlayVideo(i)" @mouseleave="tjStopVideo(i)" style="margin-top: 15px">
                     <video ref="tjVideo" muted src="http://youbili-test.oss-cn-beijing.aliyuncs.com/TestVideo-1080P.mp4"
                            class="vdo-sty" >
                     </video>
@@ -36,13 +36,13 @@
         </el-row>
       </div>
 
-      <div>
+      <div >
         <el-row :gutter="20">
 <!--          v-infinite-scroll="load"-->
             <el-col v-for="(v,i) of sum" :key="i" :span="8" >
               <router-link to="/videoIndex">
-                <el-card>
-              <div class="sp_box" style="height: 300px;margin-top: 10px"  @mouseenter="playVideo(i)" @mouseleave="stopVideo(i)">
+                <el-card style="margin-top: 20px;height: 350px" class="zoom">
+              <div class="sp_box" style="height: 300px;"  @mouseenter="playVideo(i)" @mouseleave="stopVideo(i)">
                 <video ref="myVideo" muted src="http://youbili-test.oss-cn-beijing.aliyuncs.com/TestVideo-1080P.mp4"
                        class="vdo-sty" >
                 </video>
@@ -242,4 +242,11 @@ export default {
 .el-carousel__item:nth-child(2n+1) {
   background-color: #d3dce6;
 }
+.zoom:hover {
+  transform: scale(1.01); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
+}
+.zoom {
+  transition: transform 0.3s; /* Animation */
+}
+
 </style>
\ No newline at end of file