1

src/views/HomeView/index.vue

@@ -1,5 +1,44 @@
 <script setup lang="ts"></script>
 
-<template>首页</template>
+<template>
+    <div class="homeBox">
+        <div class="HBHeader">
+            <div>热点新闻一这是标题比萨卷凯撒沙拉碗就是啊</div>
+            <div>热点新闻一这是标题比萨卷凯撒沙拉碗就是热点新闻一这是标题比萨卷凯撒沙拉碗就是啊热点新闻一这是标题比萨</div>
+        </div>
 
-<style scoped></style>
+        <div class="imgTemplate"></div>
+    </div>
+</template>
+
+<style scoped lang="scss">
+.homeBox {
+    border: 1px solid red;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+
+    .HBHeader {
+        width: 1200px;
+        border: 1px solid red;
+        height: 100px;
+
+        div:nth-chile(1) {
+            font-size: 24px;
+            color: #000000;
+            line-height: 0px;
+            letter-spacing: 50px;
+            text-align: left;
+            font-style: normal;
+            text-transform: none;
+        }
+    }
+
+    .imgTemplate {
+        border: 1px solid red;
+        height: 288px;
+        width: 1200px;
+    }
+}
+</style>