样式调整

assets/scss/cus-client/cus-client-page.scss

@@ -864,8 +864,8 @@
       margin: 54px -24px 0;
       li{width: 25%;display: inline-block;text-align: center}
       i{width: 100px;height: 100px;display: block;margin: 0 auto;}
-      span{font-size: 14px;color: #333;}
-      div{box-shadow: 0 0 7px 2px #f5f2ff;margin: 24px;padding: 40px 0;}
+      span{@include setFontStyle(-4);color: #333;margin-top: 10px;display: block;}
+      div{box-shadow: 0 0 7px 2px #f5f2ff;margin: 24px;padding: 42px 0;}
       li:nth-child(1) i{background: url("~static/images/client/resources/train-scheme-icon1.png")}
       li:nth-child(2) i{background: url("~static/images/client/resources/train-scheme-icon2.png")}
       li:nth-child(3) i{background: url("~static/images/client/resources/train-scheme-icon3.png")}
@@ -891,12 +891,13 @@
         li{
           width: 33.33%;display: inline-block;
           a{display: none;}
-          div{background: #fff;border-radius: 8px;margin: 0 16px 40px;}
+          div{background: #fff;border-radius: 8px;margin: 0 16px 40px;box-shadow: 0 0 7px 2px #f5f2ff;}
           span{width:342px;height:192px;display: inline-block;margin-top: 16px;border-radius:4px;overflow: hidden;position: relative}
           i{width: 48px;height: 48px;cursor: pointer;background-image: url("~static/images/client/course/course-video-icon.svg");display: inline-block;position: absolute;
             left: 50%;margin-left: -24px;z-index: 5;top: 50%;margin-top: -24px;background-size: cover;background-position: bottom;transition: all 0.5s;}
           img{transition: all 0.5s;}
-          p{@include setFontStyle(-4);color: rgba(0,0,0,0.65);padding: 24px 0 24px;}
+          p{@include setFontStyle(-4);color: #3e7ce7;padding: 24px 16px 16px;text-align: left}
+          .course-explain-black{@include setFontStyle(-4);color: #333;line-height: 24px;padding: 0 16px 24px;}
         }
         li span:hover{img{transform: scale(1.1);}}
         li i:hover{background-image: url("~static/images/client/course/course-video-icon-a.svg");background-size: cover;background-position: bottom;}

pages/resources/index.vue

@@ -50,9 +50,29 @@
       <h4 class="client-title">课程内容形式多样</h4>
       <div class="client-container tc">
         <ul class="learn-box-list">
-          <li><a href="https://1251882694.vod2.myqcloud.com/51d57535vodtransgzp1251882694/9cc031355285890792886057331/v.f30.mp4"></a><div><span><img :src="courseVideoImg16" alt="FLASH动画课程"><i @click="playVideo(15)"></i></span><p>FLASH动画课程</p></div></li>
-          <li><a href="https://spdb.mtavip.com/65615d29a5da4478b8d4ebfd6810d2da/65ab43fa5fb942aab2af981c2f7ea5c7-da005714eae365940692db31fbf6e9b8-fd.mp4"></a><div><span><img :src="courseVideoImg8" alt="视频课程"><i @click="playVideo(7)"></i></span><p>视频课程</p></div></li>
-          <li><a href="https://1251882694.vod2.myqcloud.com/51d57535vodtransgzp1251882694/9ce0a1a35285890792886070899/v.f30.mp4"></a><div><span><img :src="courseVideoImg6" alt="名师讲堂"><i @click="playVideo(5)"></i></span><p>名师讲堂</p></div></li>
+          <li>
+            <a href="https://1251882694.vod2.myqcloud.com/51d57535vodtransgzp1251882694/9cc031355285890792886057331/v.f30.mp4"></a>
+            <div>
+              <span><img :src="courseVideoImg16" alt="FLASH动画课程"><i @click="playVideo(15)"></i></span>
+              <p>FLASH动画课程</p>
+              <p class="course-explain-black">主要以图文动画的形式表现教学者的作用和教与学之间的关系，从而改变学习的本质</p>
+            </div>
+          </li>
+          <li>
+            <a href="https://spdb.mtavip.com/65615d29a5da4478b8d4ebfd6810d2da/65ab43fa5fb942aab2af981c2f7ea5c7-da005714eae365940692db31fbf6e9b8-fd.mp4"></a>
+            <div>
+              <span><img :src="courseVideoImg8" alt="视频课程"><i @click="playVideo(7)"></i></span>
+              <p>视频课程</p>
+              <p class="course-explain-black">把教师视频与PowerPoint课件一并摄制下来，生成为视频课件</p>
+            </div>
+          </li>
+          <li>
+            <a href="https://1251882694.vod2.myqcloud.com/51d57535vodtransgzp1251882694/9ce0a1a35285890792886070899/v.f30.mp4"></a>
+            <div><span><img :src="courseVideoImg6" alt="名师讲堂"><i @click="playVideo(5)"></i></span>
+              <p>名师讲堂</p>
+              <p class="course-explain-black">各行各业讲师汇聚一堂，为不同专属领域打造明星级课堂</p>
+            </div>
+          </li>
         </ul>
         <div class="platform-products-services">
           <a rel="nofollow" class="client-default-Btn" href="https://cdnks.mtavip.com/a/register?flug=2" target="_blank">申请方案</a>