开始设计布局

code/web/task_schedule/src/style.css

@@ -5,10 +5,9 @@ html {
 }
 
 body {
-    width: 100vw;
+    /* width: 100vw;
-    height: 100vh;
+    height: 100vh; */
     padding: 0px;
     margin: 0px;
     overflow: hidden;
 }
-

code/web/task_schedule/src/views/DesktopArchievement.vue

@@ -9,7 +9,13 @@
 -->
 <template>
     <div class="view-wrapper">
-        <span>对标先进&nbsp;比学赶超</span>
+        <!-- <div class="left-wrapper"></div> -->
+        <div class="center-wrapper">
+            <span class="slogan">对标先进&nbsp;比学赶超</span>
+        </div>
+        <div class="right-wrapper">
+
+        </div>
     </div>
 </template>
 
@@ -44,14 +50,20 @@ export default {
 <style scoped lang="scss">
 .view-wrapper {
     box-sizing: border-box;
+    min-height: 600px;
     height: 100vh;
+    min-width: 1280px;
     width: 100vw;
-    border: 1px solid red;
+    padding: 5mm;
-}
+    display: flex;
+    justify-content: end;
+    align-items: stretch;
 
-span {
+    .slogan {
         margin: 0px;
+        padding-top: 15px;
         display: block;
+        text-align: center;
 
         font: {
             family: "FZ-ZHUOHEI";
@@ -68,6 +80,22 @@ span {
         #feebb1 4px 4px,
         #feebb1 4px -4px,
         #feebb1 -4px 4px;
+    }
+
+    div {
+        border: 1px solid red;
+        box-sizing: border-box;
+    }
+}
+
+.center-wrapper {
+    width: 50%;
+    // margin-left: auto;
+}
+
+.right-wrapper {
+    min-width: 400px;
+    width: 25%;
 }
 </style>
 <style lang="scss">