Sfoglia il codice sorgente

打印结果样式错乱问题

wyq 3 anni fa
parent
commit
c22499f681
2 ha cambiato i file con 73 aggiunte e 29 eliminazioni
  1. 37 0
      src/css/print.css
  2. 36 29
      src/css/staticInfo.less

+ 37 - 0
src/css/print.css

@@ -9,4 +9,41 @@
   .info_left{
     display: block;
   }
+  .result{
+    background: #EDFAFF;
+    border-radius: 10px;
+    font-size: 14px;
+    font-weight: 500;
+    color: #333333;
+    display: none;
+    margin: 0 75px;
+    text-align: center;
+  }
+  .result_box{
+    padding:25px 56px;
+    display: flex;
+  }
+  .result_left{
+    float: left;
+    display: flex;
+  }
+  .result_left>span{
+    display: block;
+    float: left;
+    width: 42px;
+  }
+  .result_title{
+    float: left;
+  }
+  .hel{
+    width: 21px;
+    height: 21px;
+    background: #2C96E5;
+    border-radius: 50%;
+    color: #fff;
+    font-size: 12px;
+    vertical-align: middle;
+    float: left;
+    margin-right: 9px;
+  }
 }

+ 36 - 29
src/css/staticInfo.less

@@ -427,20 +427,28 @@
   text-align: center;
   .result_box{
     padding:25px 56px;
-    display: inline-block;
+    display: flex;
     .result_left{
       float: left;
+      display: flex;
+      & span{
+        display: block;
+        float: left;
+        width: 42px;
+      }
       .hel{
+        width: 21px;
+        height: 21px;
         background: #2C96E5;
         border-radius: 50%;
         color: #fff;
-        margin-right: 9px;
         font-size: 12px;
         vertical-align: middle;
+        float: left;
+        margin-right: 9px;
       }
     }
     .result_title{
-      max-width: 85%;
       float: left;
     }
   }
@@ -495,7 +503,7 @@
   
 }
 #inputs{
-  position: absolute;top: 0;left: 0;opacity: 0;z-index: -10;
+  position: absolute;top: 0;left: 0;opacity: 0;z-index: -10;display:none
 }
 #Print{
   width: 100%!important;
@@ -504,7 +512,6 @@
 }
 .scale{
   .infos-box{
-    
     margin: 0 71px 20px 38px;
     .infoWrapper {
       padding: 0 75px;
@@ -518,27 +525,27 @@
   color: red!important;
 }
 .info_left {
-    width: 527px;
-    margin: auto;
-    display: none;
-    overflow: hidden;
-    margin-top: 10px;
-    border:1px solid #D8D8D8;
-    li {
-      width: 50%;
-      height: 30px;
-      padding: 0 10px;
-      box-sizing: border-box;
-      border: 1px solid #bbbfc1;
-      border-right: none;
-      font-size: 14px;
-      float: left;
-      border-bottom: none;
-    }
-    &:nth-child(1) {
-      border-top: none;
-    }
-    &:nth-child(odd) {
-      border-left: none;
-    }
-  }
+  width: 527px;
+  margin: auto;
+  display: none;
+  overflow: hidden;
+  margin-top: 10px;
+  border:1px solid #D8D8D8;
+  li {
+    width: 50%;
+    height: 30px;
+    padding: 0 10px;
+    box-sizing: border-box;
+    border: 1px solid #bbbfc1;
+    border-right: none;
+    font-size: 14px;
+    float: left;
+    border-bottom: none;
+  }
+  &:nth-child(1) {
+    border-top: none;
+  }
+  &:nth-child(odd) {
+    border-left: none;
+  }
+}