7天活动页面

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

@@ -1613,7 +1613,10 @@
       .course-blue-title{color: #3E7BE6;}
 
       // 页面文字
-      .make-course-h2{width: 100%;text-align: center;height: 28px;padding: 40px 0;border-bottom: 1px solid #CCC;}
+      .make-course-h2{
+        width: 100%;text-align: center;padding: 40px 0;border-bottom: 1px solid #CCC;
+        img{max-width: 100%;}
+      }
 
       // 基本介绍
       .makeCourse-introduce-box{
@@ -1656,7 +1659,8 @@
     // 课程体系
     .course-system-box{
       padding: 32px 0;
-      .course-system-img{margin-bottom: 40px;}
+      .course-system-img{margin-bottom: 40px;max-width: 100%;}
+      img{max-width: 100%;}
     }
 
     // 微课设计
@@ -1667,6 +1671,7 @@
 
     // 报名学习
     .sign-study-box{
+      width: 100%;
       .study-gj-box{width: 100%;height: 298px;background-image:url("~static/images/client/makeCourse/sign-study-bj.png");
         margin-top: 20px;border-radius: 8px;bottom: -20px;position: relative;}
       .sign-study-content{
@@ -1694,20 +1699,28 @@
     @media (max-width: 768px) {
       // 按钮
       .client-default-Btn{width: 120px;height: 35px;line-height: 35px;margin: 32px auto 0;}
+
       // 页面标题
       .make-course-title {font-size: 16px;margin-bottom: 16px;color: #3E7BE6;padding-left: 0;font-weight: bold;}
+
+      // 页面文字
+      .make-course-h2{
+        padding: 32px 0;
+      }
+
       // 基本介绍
       .makeCourse-introduce-box{
         margin: 32px 0;
-        img{max-width: 100%;}
+        img{max-width: 100%;display: block;margin: 0 auto;}
         dl {
-          width: 100%;float: unset;padding: 24px 10px;box-sizing: border-box;text-align: justify;
+          width: 100%;float: unset;padding: 24px 10px;box-sizing: border-box;text-align: center;
+          h3{text-align: center;}
           dt {font-size: 14px;margin-bottom: 16px;color: #555555;padding-left: 0;line-height: 24px}
         }
       }
       .contrary-introduce-box{
         dl {
-          width: 100%;float: unset;padding: 24px 10px;box-sizing: border-box;text-align: justify;height: unset;
+          width: 100%;float: unset;padding: 24px 10px;box-sizing: border-box;text-align: center;height: unset;
           dt {margin-bottom: 4px;}
         }
       }
@@ -1747,8 +1760,35 @@
       }
 
       // 报名学习
-      .sign-study-box{}
+      .sign-study-box{
+        background: #3776ff;
+        .client-container{padding: 0;}
+        .study-gj-box{height:180px;background-image:url("~static/images/client/makeCourse/sign-study-sjBj.png");background-size: contain;background-repeat: no-repeat;
+        bottom: 0;border-radius: 0;background-position: center;}
+        .sign-study-content{
+          bottom: 40px;left: 40px;right: 40px;
+          .el-input{
+            width: 68%;font-size: 14px;vertical-align: middle;
+            .el-input__inner{height: 38px;font-size: 14px}
+            .el-input__inner::-webkit-input-placeholder { /* WebKit browsers */
+              font-size: 14px;
+            }
+
+            .el-input__inner::-moz-placeholder { /* Mozilla Firefox 19+ */
+              font-size: 14px;
+            }
+
+            .el-input__inner:-ms-input-placeholder { /* Internet Explorer 10+ */
+              font-size: 14px;
+            }
+          }
+
+          .el-button{width:32%;height:38px;font-size: 14px;border-radius: 2px;vertical-align: middle;    padding: 0;}
+        }
+      }
     }
+
+
   }
 }
 

pages/makeCourse.vue

@@ -7,7 +7,10 @@
     </div>
 
     <!-- 图片标题-->
-    <h2 class="make-course-h2 mta-hidden-xs"><img :src="makeCourseImg" alt="快速掌握知识萃取的方法，形成有价值、易懂易学的高质量学习资源"></h2>
+    <h2 class="make-course-h2">
+      <img :src="makeCourseImg" alt="快速掌握知识萃取的方法，形成有价值、易懂易学的高质量学习资源" class="mta-hidden-xs">
+      <img :src="makeCourseSjImg" alt="快速掌握知识萃取的方法，形成有价值、易懂易学的高质量学习资源" class="mta-hidden-sm">
+    </h2>
 
     <!-- 介绍 -->
         <div class="client-container fn-clear">
@@ -102,11 +105,12 @@
      </div>
 
     <!-- 课程体系 -->
-    <div class="course-system-box mta-hidden-xs">
+    <div class="course-system-box">
       <div class="client-container">
         <h3 class="make-course-title course-blue-title">课程体系</h3>
-        <img :src="courseSystemImg1" alt="" class="course-system-img">
-        <img :src="courseSystemImg2" alt="">
+        <img :src="courseSystemImg1" alt="" class="course-system-img mta-hidden-xs">
+        <img :src="courseSystemImg2" alt="" class="mta-hidden-xs">
+        <img :src="courseSystemImg3" alt="" class="mta-hidden-sm">
         <a href="https://p.qiao.baidu.com/cps/chat?siteId=11735491&amp;userId=10530011&amp;siteToken=a3e003e938e3a18608b460fc992182b8" target="_blank" class="btn-big-box mta-hidden-xs">
           <img :src="btnBigImg" alt="">
         </a>
@@ -137,7 +141,7 @@
     </div>
 
     <!-- 报名学习 -->
-    <div class="sign-study-box mta-hidden-xs">
+    <div class="sign-study-box">
       <div class="client-container">
         <div class="study-gj-box">
           <div class="sign-study-content">
@@ -172,6 +176,7 @@
     data() {
       return {
         makeCourseImg:  require(`~/static/images/client/makeCourse/makeCourse-h2-text.png`),
+        makeCourseSjImg:  require(`~/static/images/client/makeCourse/makeCourse-h2-sjText.png`),
         introduceImg1:  require(`~/static/images/client/makeCourse/introduce-img1.png`),
         introduceImg2:  require(`~/static/images/client/makeCourse/introduce-img2.png`),
         btnImg:  require(`~/static/images/client/makeCourse/content_button.png`),
@@ -184,6 +189,7 @@
         pxTeacherImg:  require(`~/static/images/client/makeCourse/px-teacher-img.png`),
         courseSystemImg1:  require(`~/static/images/client/makeCourse/course-system-img1.png`),
         courseSystemImg2:  require(`~/static/images/client/makeCourse/course-system-img2.png`),
+        courseSystemImg3:  require(`~/static/images/client/makeCourse/course-system-img3.png`),
         phoneNumber:'',// 手机号
         exportDataStatus:   true,// 按钮禁用
         countdown:          10,// 十秒倒计时