样式调整

assets/css/consult/list.scss

@@ -1,26 +1,41 @@
 .consult-wrapper {
-    position: relative;
-    max-width: 1000px;
+    //position: relative;
+    //max-width: 1000px;
+    //width: 100vw;
     width: 100vw;
     .consult-top {
-        position: relative;
+      position: fixed;
+      z-index: 100;
+      top: 65px;
+      width: 100%;
+      height: 45px;
+      margin: 0px auto;
+      background: white;
+      box-shadow: 0 1px 2px 0 rgba(0,0,0,0.05);
+      .consult-top-content {
+        display: flex;
         width: 100%;
-        height: auto;
-        padding-bottom: 15px;
-        background: #ffffff;
-        border-radius: 10px;
+        max-width: 1100px;
+        margin: 0 auto;
+      }
         .tabs {
-            width: 100%;
-            height: 50px;
-            display: flex;
-            align-items: center;
-            border-bottom: 1px solid #f1f1f1;
+          flex: 1;
+          display: flex;
+          align-items: center;
+            //width: 100%;
+            //height: 50px;
+            //display: flex;
+            //align-items: center;
+            //border-bottom: 1px solid #f1f1f1;
+
             .tabs-item {
                 position: relative;
-                width: 108px;
+                //width: 108px;
+                margin-right: 30px;
+                margin-left: 10px;
                 height: 50px;
                 line-height: 50px;
-                font-size: 16px;
+                font-size: 14px;
                 font-family: PingFangSC, PingFangSC-Regular;
                 font-weight: 400;
                 text-align: center;
@@ -213,7 +228,7 @@
                 background: #ffffff;
                 border-radius: 10px;
                 overflow: hidden;
-                box-shadow: 0px 6px 16px 0px rgba(6,10,28,0.06); 
+                box-shadow: 0px 6px 16px 0px rgba(6,10,28,0.06);
                 display: flex;
                 flex-direction: column;
                 // cursor: pointer;
@@ -339,7 +354,7 @@
                 background: #ffffff;
                 border-radius: 10px;
                 overflow: hidden;
-                box-shadow: 0px 6px 16px 0px rgba(6,10,28,0.06); 
+                box-shadow: 0px 6px 16px 0px rgba(6,10,28,0.06);
                 display: flex;
                 flex-direction: column;
                 &:nth-of-type(3n) {
@@ -694,7 +709,7 @@
                 background: #ffffff;
                 overflow: hidden;
                 border-radius: 10px;
-                box-shadow: 0px 6px 16px 0px rgba(6,10,28,0.06); 
+                box-shadow: 0px 6px 16px 0px rgba(6,10,28,0.06);
                 display: flex;
                 flex-direction: column;
                 .owner-content {

pages/company/list.vue

@@ -8,34 +8,36 @@
   >
     <div class="consult-wrapper">
       <div class="consult-top">
-        <div class="tabs">
-          <div
-            class="tabs-item"
-            :class="num == 0 ? 'active' : ''"
-            @click="tabsItem(0)"
-          >
-            全部
-          </div>
-          <div
-            class="tabs-item"
-            :class="num == 19 ? 'active' : ''"
-            @click="tabsItem(19)"
-          >
-            技术服务商
+        <div class="consult-top-content">
+          <div class="tabs">
+            <div
+              class="tabs-item"
+              :class="num == 0 ? 'active' : ''"
+              @click="tabsItem(0)"
+            >
+              全部
+            </div>
+            <div
+              class="tabs-item"
+              :class="num == 19 ? 'active' : ''"
+              @click="tabsItem(19)"
+            >
+              技术服务商
+            </div>
+            <div
+              class="tabs-item"
+              :class="num == 18 ? 'active' : ''"
+              @click="tabsItem(18)"
+            >
+              人力外包
+            </div>
           </div>
-          <div
-            class="tabs-item"
-            :class="num == 18 ? 'active' : ''"
-            @click="tabsItem(18)"
-          >
-            人力外包
+          <div class="tabs-right">
+            <a :href="`${baseUrl}/cert/type/19`">
+              <img class="tabs-right-img" src="@/assets/img/jsfws.png" />
+            </a>
           </div>
         </div>
-        <div class="tabs-right">
-          <a :href="`${baseUrl}/cert/type/19`">
-            <img class="tabs-right-img" src="@/assets/img/jsfws.png" />
-          </a>
-        </div>
       </div>
       <div class="content">
         <div class="content-right">
@@ -252,6 +254,7 @@ export default {
 
 <style lang="scss" scoped>
 @import "@/assets/css/consult/list.scss";
+
 ::v-deep .el-step__icon.is-text {
   border: none;
 }
@@ -267,10 +270,16 @@ export default {
   display: flex;
   flex-wrap: wrap;
   flex-direction: row-reverse;
+  width: 100%;
+  max-width: 1100px;
+  margin: 0 auto;
+  padding-top: 50px;
+
+
   .content-right {
     font-size: 14px;
     line-height: 1.5;
-    margin-top: 10px;
+    margin-top: 0px;
     width: 356px;
     height: 627px;
     background: #fff;
@@ -302,6 +311,7 @@ export default {
   .company-list a .img {
     width: 100px;
     height: 100px;
+
   }
   .content {
     .content-right {
@@ -339,8 +349,8 @@ export default {
     display: flex;
     font-family: PingFangSC, PingFangSC-Regular;
     padding: 18px;
-    margin-top: 10px;
     background: #fff;
+    border-bottom: 1px solid rgba(0,0,0,0.05);
     .right {
       flex: 1;
       padding-left: 16px;
@@ -350,6 +360,7 @@ export default {
       height: 164px;
       background: #fff;
       border-radius: 8px;
+
     }
     .title {
       color: #222;
@@ -396,13 +407,13 @@ export default {
   }
 }
 .pagination {
-  margin-top: 10px;
-  background: #fff;
   width: 100%;
+  max-width: 1100px;
+  margin: 0 auto;
   height: 65px;
   display: flex;
   align-items: center;
-  justify-content: center;
+  justify-content: flex-start;
   .el-pagination {
     padding: 0;
   }