适应1300的屏幕

src/App.vue

@@ -82,11 +82,10 @@
     }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 #app {
     font-size: 16px;
-    min-width: 1300px;
+    min-width: $inner-width;
-    min-height: 800px;
 }
 .selectBusiness {
     width: 100%;

src/components/case/index.vue

@@ -130,7 +130,7 @@
 
 
     <!-- 遮罩层 -->
-    <div class="absolute z-50 w-screen h-screen bg-transparent inset-0" v-show="showIt"></div> 
+    <div class="absolute z-50 h-screen bg-transparent inset-0" v-show="showIt"></div> 
 
     <el-dialog
       title="提示"

src/layouts/home/index.vue

@@ -56,7 +56,5 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-    .main{
+
-        min-height: 99vh;
-    }
 </style>

src/pages/index/list/index.vue

@@ -149,6 +149,8 @@ export default {
 
 
     .wrap{
+        position: relative;
+        min-height: calc(100vh - 68px);
         .sth{
             position: absolute;
             &.cp{
@@ -162,7 +164,7 @@ export default {
             height: 100%;
         }
         .integrated-counter{
-            top: -5%;
+            top: -14%;
             left: 24%;
             width: 43%;
             transition: all .5s;
@@ -177,7 +179,7 @@ export default {
             }
         }
         .international{
-            top: 0;
+            top: -9%;
             left: 72%;
             width: 28%;
             transition: all .5s;
@@ -193,19 +195,18 @@ export default {
             .name{
                 position: absolute;
                 top: 23%;
-                left: 54%;
+                right: 0;
                 @include nameTip;
             }
             
         }
         .manager{
-            top: 47%;
+            bottom: 0;
-            left: 59%;
+            left: 57%;
             width: 39%;
             transition: all .5s;
             &:hover{
-                z-index: 9999;
+                bottom: 10px;
-                top: calc(47% - 10px);
             }
             .name {
                 position: absolute;
@@ -215,35 +216,35 @@ export default {
             }
         }
         .credit-dep{
-            top: 35%;
+            top: 31%;
             left: 0;
             width: 20%;
             transition: all .5s;
             &:hover{
-                top: 33%;
+                top: 29%;
             }
         }
         .company-finance{
-            top: 55%;
+            top: 52%;
             left: 9%;
             width: 28%;
             transition: all .5s;
             &:hover{
-                top: 53%;
+                top: 50%;
             }
         }
         .personal-finance{
-            top: 72%;
+            bottom: 0;
             left: 25%;
             width: 30%;
             transition: all .5s;
             &:hover{
-                top: 70%;
+                bottom: 10px;
             }
         }
         .case{
             position: absolute;
-            top: 160px;
+            top: 92px;
             left: 150px;
             width: 150px;
             height: 50px;
@@ -260,18 +261,23 @@ export default {
         }
         @media(max-width: 1440px){
             .credit-dep{
-                top: 36%;
+                top: 32%;
             }
             .company-finance{
-                top: 58%;
+                top: 53%;
             }
             .personal-finance{
-                top: 74%;
+                top: 72%;
             }
             .integrated-counter{
                 width: 44%;
             }
         }
+        @media(max-width: 1300px){
+          & {
+              min-height: calc(100vh - 76px);
+          }
+        }
     }
     .coming{
         position: fixed;

src/styles/layout/index.scss

@@ -9,7 +9,6 @@ body,
 }
 
 body {
-    min-width: 1440px;
     font-family: 'PingFang SC', "Helvetica Neue", Helvetica, "microsoft yahei", arial, STHeiTi, sans-serif;
     font-size: 14px;
     background: rgba(0, 0, 0, 0.02);

src/styles/var.scss

@@ -1,5 +1,5 @@
 $main-color: #568DF2;
-$inner-width: 1440px;
+$inner-width: 1300px;
 
 @mixin ellipsis {
     overflow: hidden;