Przeglądaj źródła

修改样式:使table的横向scroll可以看见

littlegreen 9 miesięcy temu
rodzic
commit
e421c6a4eb
1 zmienionych plików z 15 dodań i 2 usunięć
  1. 15 2
      src/App.vue

+ 15 - 2
src/App.vue

@@ -27,7 +27,7 @@
       <input type="text" placeholder="请输入导出压缩包的文件名" v-model="zipName" v-show="fileType === '2'">
       <button @click="toPdf">{{ fileType === '1' ? '生成图片导出' : '生成压缩包导出' }}</button>
     </div>
-    <el-table :data="datalist" border stripe @selection-change="handleSelectionChange" id="out-table">
+    <el-table :data="datalist" border stripe @selection-change="handleSelectionChange" id="out-table" height="100%" style="flex: 1 1 auto;">
       <el-table-column type="selection" width="55">
       </el-table-column>
       <el-table-column prop="front" label="前12位编码" width="120">
@@ -612,13 +612,26 @@ export default {
 </script>
 
 <style>
+* {
+  padding: 0;
+  margin: 0;
+}
+body,
+html {
+  height: 100vh;
+  overflow: hidden;
+}
 #app {
   font-family: 黑体, simhei;
   /* Avenir, Helvetica, Arial, sans-serif */
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: #2c3e50;
-  margin-top: 20px;
+  padding: 20px 20px 0;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
 }
 
 p {