diff --git a/src/App.vue b/src/App.vue
index 551ba9e..39ae6cc 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,8 +1,6 @@
 <template>
-
   <router-view />
   <login></login>
->>>>>>> 542e853 (提交)
 </template>
 <script setup>
 import login from '@/components/public/login.vue'
diff --git a/src/assets/img/publicImage/transmit-icon.png b/src/assets/img/publicImage/transmit-icon.png
new file mode 100644
index 0000000..8314c16
Binary files /dev/null and b/src/assets/img/publicImage/transmit-icon.png differ
diff --git a/src/views/apartmentDetail.vue b/src/views/apartmentDetail.vue
index 1004eea..8262d58 100644
--- a/src/views/apartmentDetail.vue
+++ b/src/views/apartmentDetail.vue
@@ -1,9 +1,38 @@
 <template>
     <page-top-bar></page-top-bar>
 
-    <div class="content"></div>
+    <div class="content wid1200">
+        <div class="header">
+            <div class="top flexflex">
+                <div class="brand-name flexcenter">ZHELI這裡</div>
+                <div class="brand-abstract">高颜值高品质学生公寓，城理浸公学生首选</div>
+            </div>
+        </div>
 
-    
+        <div class="operate-box flexacenter">
+            <div class="nav-box flexacenter">
+                <div class="nav-item flexcenter" :class="{ 'pitch': item == 1 }" v-for="item in 5">优惠活动</div>
+            </div>
+            <div class="btn-box flexacenter">
+                <div class="btn-item transmit-btn flexcenter">
+                    <img class="transmit-icon" src="@/assets/img/publicImage/transmit-icon.png" />
+                    转发
+                </div>
+                <div class="btn-item consult-btn flexcenter">咨询</div>
+            </div>
+        </div>
+        <div class="details-box flexflex">
+            <div class="details-left flex1">
+                <div class="type-box">
+                    <div class="type-item">
+                        <div class="type-name">双人套间A</div>
+                    </div>
+                </div>
+            </div>
+            <div class="details-right"></div>
+        </div>
+
+    </div>
 </template>
 
 <script setup>
@@ -13,4 +42,125 @@ const uniqid = "1qfWOLTPbyPH"
 
 </script>
 
-<style lang="less" scoped></style>
\ No newline at end of file
+<style lang="less" scoped>
+.content {
+    margin: 0 auto;
+    height: 100px;
+    background-color: rgb(13, 67, 114);
+    font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
+
+    .top {
+        width: 1200px;
+        height: 65px;
+        background: -webkit-linear-gradient(356.899508550192deg, rgba(253, 218, 85, 1) 0%, rgba(229, 215, 190, 1) 50%, rgba(203, 254, 191, 1) 100%);
+        background: -moz-linear-gradient(93.1004914498078deg, rgba(253, 218, 85, 1) 0%, rgba(229, 215, 190, 1) 50%, rgba(203, 254, 191, 1) 100%);
+        background: linear-gradient(93.1004914498078deg, rgba(253, 218, 85, 1) 0%, rgba(229, 215, 190, 1) 50%, rgba(203, 254, 191, 1) 100%);
+        border-radius: 16px 16px 0 0;
+        padding: 0 30px;
+
+        .brand-name {
+            height: 22px;
+            background-color: rgba(128, 108, 36, 1);
+            border-radius: 8px;
+            font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
+            color: #FDDA55;
+            padding: 0 11px;
+            margin-top: 12px;
+            margin-right: 10px;
+        }
+
+        .brand-abstract {
+            color: #806C24;
+            font-size: 14px;
+            padding-top: 13px;
+        }
+    }
+
+    .operate-box {
+        width: 1200px;
+        height: 70px;
+        background-color: rgba(255, 255, 255, 1);
+        border: 1px solid rgba(235, 235, 235, 1);
+        border-radius: 16px;
+        -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
+        -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
+        box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
+        font-size: 14px;
+        padding: 0 30px;
+        justify-content: space-between;
+
+        .nav-box {
+            .nav-item {
+                height: 40px;
+                background-color: rgba(246, 246, 246, 1);
+                border-radius: 8px;
+                font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
+                font-weight: 400;
+                font-size: 14px;
+                color: #7F7F7F;
+                padding: 0 17px;
+                cursor: pointer;
+
+                &.pitch {
+                    background-color: #000;
+                    font-weight: 650;
+                    color: #fff;
+                }
+
+                &:not(:last-of-type) {
+                    margin-right: 10px;
+                }
+            }
+        }
+
+        .btn-box {
+
+            .btn-item {
+                width: 100px;
+                height: 40px;
+                border-radius: 50px;
+                cursor: pointer;
+
+                &.transmit-btn {
+                    border: 1px solid rgba(235, 235, 235, 1);
+                    color: #333333;
+                    margin-right: 10px;
+
+                    .transmit-icon {
+                        width: 20px;
+                        height: 20px;
+                        margin-right: 4px;
+                    }
+                }
+
+                &.consult-btn {
+                    background: -webkit-linear-gradient(324.854454500294deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
+                    background: -moz-linear-gradient(125.145545499706deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
+                    background: linear-gradient(125.145545499706deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
+                    font-size: 16px;
+                    color: #FFFFFF;
+                }
+            }
+        }
+    }
+
+    .details-box {
+        justify-content: space-between;
+        height: 100px;
+        background-color: #FDDA55;
+
+        .details-left {
+            .type-box {
+                .type-item {
+                    height: ;
+                }
+            }
+        }
+
+        .details-right {
+            width: 304px;
+        }
+    }
+
+}
+</style>
\ No newline at end of file