修改navbar

src/components/NavBar/index.vue

 <template>
   <div :class="{
     nav: true,
+    'header-absolute':true,
     'header-fixed ': isFixed,
-    'home-nav': isHome || isBoutique,
+    // 'header-absolute': isHome || isBoutique,
     'show-themeColor': isFixed && isHome,
     isChStyle: navbarStyle == '2',
     isRedStyle: navbarStyle == '3',
@@ -28,7 +29,6 @@
               style="transform: translate(30%,30%);cursor: pointer;"></i>
           </div>
         </div>
-
         <div class="tools animate__animated animate__fadeInRight">
           <div class="wrapper">
             <el-dropdown trigger="click">
@@ -474,7 +474,7 @@ export default {
 <style lang="scss" scoped>
 // #2069c4: #2069c4;
 
-.home-nav {
+.header-absolute {
   position: absolute;
   top: 0;
   left: 0;
@@ -518,14 +518,12 @@ export default {
 }
 
 .nav {
-  height: 100px;
+  height: 120px;
   width: 100%;
   transition: all 0.5s ease;
   background-color: $themeColor;
-  // background-color: #fff;
-  // background-image: url('@/assets/imgs/home/panel-bg.png');
   box-shadow: rgba(0, 0, 0, 0.3) 0 1px 5px 0px;
-
+  padding: 10px 0;
   .container {
     width: 100%;
     height: 100%;
@@ -533,21 +531,15 @@ export default {
     align-items: center;
     justify-content: space-between;
     padding: 0 70px 0 100px;
-
-    // overflow: hidden;
+    flex-direction: column;
     .logo-container {
-      // width: 380px;
-      // height: 74px;
       display: flex;
       align-items: center;
 
       img {
-        // width: 100%;
-        // height: 100%;
         width: 50px;
         height: 50px;
         border-radius: 50%;
-        // box-shadow: 2px 2px 3px 2px rgb(0 0 0 / 30%);
         margin-right: 8px;
       }
 
@@ -567,12 +559,13 @@ export default {
 
       .tabs {
         display: flex;
-        margin-right: 80px;
-        min-width: 512px;
+        // margin-right: 80px;
+        min-width: 900px;
         height: 100%;
+        justify-content: space-between;
 
         .tab-item {
-          margin-right: 70px;
+          // margin-right: 70px;
           color: #fff;
           display: flex;
           align-items: center;
@@ -611,26 +604,7 @@ export default {
               cursor: pointer;
             }
           }
-
-          // a {
-          //   font-size: 18px;
-          //   white-space: nowrap;
-          //   transition: all 0.5s ease;
-          //   color: #fff;
-          //   text-decoration: none;
-          // }
-
-          // &:hover {
-          //   a {
-          //     // color: #182f68;
-          //     color: #fff8a3;
-          //     // color: #5a4609;
-          //     text-shadow: 0 1px 2px #9fafcb, 1px 0px 2px #9fafcb;
-          //   }
-          // }
           .router-link-exact-active {
-            // color: #5a4609;
-            // color: #182f68;
             color: #fff8a3;
             text-shadow: 0 1px 2px #9fafcb, 1px 0px 2px #9fafcb;
           }
@@ -679,6 +653,8 @@ export default {
 }
 
 ::v-deep .tools {
+  position: absolute;
+  right: 10%;
   .wrapper {
     transform: translateY(4px);
   }