样式修改

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

@@ -24,8 +24,8 @@
     .client-customer-box{
       .customer-img-box{
         padding-bottom: 80px;
-        li{width: 15%;margin: 24px 2% 0 0;display: inline-block;}
-        li:nth-child(6n){margin-right: 0}
+        li{width: 30%;margin: 32px 5% 0 0;display: inline-block;}
+        li:nth-child(3n){margin-right: 0}
         img{transition: all 0.5s;width: 100%;}
         li:hover{
           img{transform: scale(1.04);box-shadow: 0 4px 8px 0 rgba(214, 214, 214, 0.76);border-radius: 6px}
@@ -42,18 +42,17 @@
 
     /* 新闻资讯 */
     .client-news-information {
-      background: #f9faff;padding-bottom: 80px;
+      background: #f9fdfc;padding-bottom: 80px;
       .industry-information-box {
         margin-top: 48px;
         h4{color: #333;}
-        h4:hover {cursor: pointer;color: #3e7ce7;}
+        h4:hover {cursor: pointer;color: #328971;}
         // 左
         .industry-information-left {
-          width: 520px;margin-right: 80px;display: inline-block;vertical-align: top;color: #333;
+          width: 480px;margin-right: 80px;display: inline-block;vertical-align: top;color: #333;
           div {float: left;border-right: 1px solid #dbdbea;padding: 8px 16px 8px 0;}
-          img {width: 520px;height: 210px;margin-bottom: 42px;}
-          h4 {@include setFontStyle(-2);margin-bottom: 16px;}
-          i{width:25px;height:12px;float:right;background-image:url("~static/images/client/index/news-information-icon.png")}
+          img {width: 480px;margin-bottom: 10px;}
+          h4 {@include setFontStyle(-2);margin-bottom: 16px;line-height: 1.6;@include single-line-ellipsis;}
           p {@include setFontStyle(-6);height: 68px;line-height: 22px;padding: 2px 0 0 16px;text-align: justify;@include multi-line-ellipsis(3);}
           b {@include setFontStyle(-4);font-weight: normal;display: block;margin-bottom: 16px;}
           span {@include setFontStyle(-6);display: block;color: #666;}
@@ -61,15 +60,20 @@
 
         // 右
         .industry-information-right {
-          width: 590px;
+          width: 630px;
           display: inline-block;
           vertical-align: top;
 
           li {border-bottom: 1px solid #ccc;margin-bottom: 16px;}
           li:last-child {border: 0;}
           h4 {@include setFontStyle(-4);@include single-line-ellipsis;margin-bottom: 12px;}
-          p {@include setFontStyle(-6);color: #666;@include single-line-ellipsis;margin-bottom: 16px;}
+          p {@include setFontStyle(-6);color: #666;margin-bottom: 16px;line-height: 1;
+            display: flex;align-items: center;@include single-line-ellipsis;}
           span {margin: 0 30px 0 10px;}
+          .content-text{
+            margin: 0;display: contents;
+            p{margin: 0;padding: 0;display: inline-block;}
+          }
         }
       }
     }

pages/index.vue

@@ -82,57 +82,28 @@
           <li><img :src="customerImg1" alt="吉邻家政" /></li>
           <li><img :src="customerImg2" alt="优逸家政" /></li>
           <li><img :src="customerImg3" alt="佳禾家政" /></li>
-          <li><img :src="customerImg1" alt="吉邻家政" /></li>
-          <li><img :src="customerImg2" alt="优逸家政" /></li>
-          <li><img :src="customerImg3" alt="佳禾家政" /></li>
-          <li><img :src="customerImg1" alt="吉邻家政" /></li>
-          <li><img :src="customerImg2" alt="优逸家政" /></li>
-          <li><img :src="customerImg3" alt="佳禾家政" /></li>
-          <li><img :src="customerImg1" alt="吉邻家政" /></li>
-          <li><img :src="customerImg2" alt="优逸家政" /></li>
-          <li><img :src="customerImg3" alt="佳禾家政" /></li>
-          <li><img :src="customerImg1" alt="吉邻家政" /></li>
-          <li><img :src="customerImg2" alt="优逸家政" /></li>
-          <li><img :src="customerImg3" alt="佳禾家政" /></li>
-          <li><img :src="customerImg1" alt="吉邻家政" /></li>
-          <li><img :src="customerImg2" alt="优逸家政" /></li>
-          <li><img :src="customerImg3" alt="佳禾家政" /></li>
-          <li><img :src="customerImg1" alt="吉邻家政" /></li>
-          <li><img :src="customerImg2" alt="优逸家政" /></li>
-          <li><img :src="customerImg3" alt="佳禾家政" /></li>
-          <li><img :src="customerImg1" alt="吉邻家政" /></li>
-          <li><img :src="customerImg2" alt="优逸家政" /></li>
-          <li><img :src="customerImg3" alt="佳禾家政" /></li>
+          <li><img :src="customerImg4" alt="吉邻家政" /></li>
+          <li><img :src="customerImg5" alt="优逸家政" /></li>
+          <li><img :src="customerImg6" alt="佳禾家政" /></li>
+          <li><img :src="customerImg7" alt="吉邻家政" /></li>
+          <li><img :src="customerImg8" alt="优逸家政" /></li>
+          <li><img :src="customerImg9" alt="佳禾家政" /></li>
         </ul>
       </div>
     </div>
 
     <!-- 合作伙伴 -->
-    <div style="background: #f9fdfc;padding-bottom: 64px">
+    <!--<div style="background: #f9fdfc;padding-bottom: 64px">
       <h4 class="client-title">合作伙伴</h4>
       <div class="client-container mt25">
         <ul class="hzhb-ul-box">
-          <li>全国工商联人才交流中心</li>
-          <li>北京家政协会</li>
-          <li>成都家政协会</li>
-          <li>全国工商联人才交流中心</li>
-          <li>成都家政协会</li>
-        </ul>
-        <ul class="hzhb-ul-box">
-          <li>全国工商联人才交流中心</li>
-          <li>北京家政协会</li>
-          <li>成都家政协会</li>
-          <li>全国工商联人才交流中心</li>
-        </ul>
-        <ul class="hzhb-ul-box">
-          <li>成都家政协会</li>
-          <li>北京家政协会</li>
-          <li>全国工商联人才交流中心</li>
-          <li>全国工商联人才交流中心</li>
-          <li>成都家政协会</li>
+          <li>中国商业联合会</li>
+          <li>中国社科教育培训中心</li>
+          <li>人力教培</li>
+          <li>全国工商联人才交流服务中心</li>
         </ul>
       </div>
-    </div>
+    </div>-->
 
     <!-- 新闻资讯 PC-->
     <div class="client-news-information" v-if="topCarousels.length > 0">
@@ -142,7 +113,7 @@
             <div class="industry-information-left">
               <img v-if="topCarousels.length > 0" :src="topCarousels[0].cover || newImage" alt="新闻资讯"/>
               <img v-else :src="newImage" alt="默认新闻"/>
-                <h4 @click="checkInfo(topCarousels[0])">{{ topCarousels[0].title }}<i></i></h4>
+                <h4 @click="checkInfo(topCarousels[0])">{{ topCarousels[0].title }}</h4>
                 <div><b>{{ topCarousels[0].yyyy }}</b><span>{{ topCarousels[0].mmdd }}</span></div>
                 <p v-html="topCarousels[0].content"></p>
             </div>
@@ -153,7 +124,7 @@
                     <a style="display: none" :href="`${baseUrl}/news/${item.id}`"></a>
                     <span>{{ item.yyyy }}</span>{{ item.title }}
                   </h4>
-                  <p><span>{{ item.mmdd}}</span><span v-html="item.content"></span></p>
+                  <p><span>{{ item.mmdd}}</span><span v-html="item.content" class="content-text"></span></p>
                 </li>
               </ul>
             </div>
@@ -233,6 +204,12 @@
         customerImg1:   require(`~/static/images/website/index/hzkh-icon1.png`),
         customerImg2:   require(`~/static/images/website/index/hzkh-icon2.png`),
         customerImg3:   require(`~/static/images/website/index/hzkh-icon3.png`),
+        customerImg4:   require(`~/static/images/website/index/hzkh-icon4.png`),
+        customerImg5:   require(`~/static/images/website/index/hzkh-icon5.png`),
+        customerImg6:   require(`~/static/images/website/index/hzkh-icon6.png`),
+        customerImg7:   require(`~/static/images/website/index/hzkh-icon7.png`),
+        customerImg8:   require(`~/static/images/website/index/hzkh-icon8.png`),
+        customerImg9:   require(`~/static/images/website/index/hzkh-icon9.png`),
         activeIndex:    '首页',
         activeName:     'first',// tab页签
       };