diff --git a/src/components/Businesses.vue b/src/components/Businesses.vue
index 7611bc3..6a82af5 100644
--- a/src/components/Businesses.vue
+++ b/src/components/Businesses.vue
@@ -183,8 +183,8 @@ onMounted(() => {
 
 :deep(.ceil) {
   padding: 0 !important;
-  margin-bottom: 5px;
-  margin-right: 2px;
+  margin-bottom: 0.3rem;
+  margin-right: 0.1rem;
 }
 
 :deep(.header-item) {
diff --git a/src/components/areaList.vue b/src/components/areaList.vue
index 7b0dca6..ea85665 100644
--- a/src/components/areaList.vue
+++ b/src/components/areaList.vue
@@ -128,7 +128,7 @@ onMounted(() => {
 }
 
 .address::-webkit-scrollbar {
-  width: 10px;
+  width: 0.63rem;
   background-color: #153041;
 }
 
diff --git a/src/components/border.vue b/src/components/border.vue
index 56706e0..77280b5 100644
--- a/src/components/border.vue
+++ b/src/components/border.vue
@@ -38,7 +38,7 @@
     background-image: linear-gradient(
       to right,
       #5bdbf6 12px,
-      transparent 120px,
+      transparent 11.25rem,
       transparent calc(100% - 150px),
       #5bdbf6 calc(100% - 12px)
     );
diff --git a/src/components/headView.vue b/src/components/headView.vue
index e29f15b..cf5cca9 100644
--- a/src/components/headView.vue
+++ b/src/components/headView.vue
@@ -140,7 +140,7 @@ onMounted(() => {
   background-image: url("../assets/img/header.png");
   background-size: 100% 100%;
   background-color: rgba($color: #000000, $alpha: 0.8);
-  height: 60px;
+  height: 3.75rem;
   align-items: center;
   position: relative;
   .img {
@@ -161,7 +161,7 @@ onMounted(() => {
     font-family: "ifonts", sans-serif;
     font-size: 2rem;
     height: 100%;
-    line-height: 50rpx;
+    line-height: 3.5rem;
   }
   .left {
     display: flex;
diff --git a/src/components/scorllList.vue b/src/components/scorllList.vue
index 56540fe..c1d5f9a 100644
--- a/src/components/scorllList.vue
+++ b/src/components/scorllList.vue
@@ -38,12 +38,12 @@ onMounted(() => {
 }
 
 .scroll-list {
-  height: 100px; /* 设置滚动列表容器的高度 */
+  height: 6.25rem; /* 设置滚动列表容器的高度 */
   overflow: hidden; /* 隐藏溢出部分 */
 }
 
 .list-item {
-  height: 40px; /* 每个列表项的高度 */
-  line-height: 40px; /* 垂直居中文本 */
+  height: 2.5rem; /* 每个列表项的高度 */
+  line-height: 2.5rem; /* 垂直居中文本 */
 }
 </style>
\ No newline at end of file
diff --git a/src/layout/index.vue b/src/layout/index.vue
index 3484ad2..e130352 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -40,7 +40,7 @@ onUnmounted(() => {
 <template>
   <dv-full-screen-container class="body">
     <headView></headView>
-    <div style="height: calc(100% - 60px)">
+    <div style="height: calc(100% - 3.75rem)">
       <router-view v-if="show"></router-view>
     </div>
     <Businesses class="businesses"></Businesses>
diff --git a/src/view/delivery/components/bottom.vue b/src/view/delivery/components/bottom.vue
index 37a5e0c..e756985 100644
--- a/src/view/delivery/components/bottom.vue
+++ b/src/view/delivery/components/bottom.vue
@@ -443,7 +443,7 @@ onMounted(() => {
 .box {
   height: 100%;
   width: 100%;
-  padding: 20px 20px;
+  padding: 1.25rem 1.25rem;
   font-size: 0.8rem;
   display: flex;
   flex-direction: column;
@@ -454,7 +454,7 @@ onMounted(() => {
     width: 100%;
     background-image: url(../../../assets/img/title3.png);
     background-size: 100% 100%;
-    height: 40px;
+    height: 2.5rem;
     display: flex;
     justify-content: center;
     align-items: center;
@@ -551,7 +551,7 @@ onMounted(() => {
 
       :deep(.ceil) {
         padding: 0 !important;
-        margin-bottom: 5px;
+        margin-bottom: 0.3rem;
       }
 
       :deep(.header-item) {
diff --git a/src/view/delivery/components/left.vue b/src/view/delivery/components/left.vue
index 503b4e1..5f56df4 100644
--- a/src/view/delivery/components/left.vue
+++ b/src/view/delivery/components/left.vue
@@ -293,7 +293,7 @@ onMounted(() => {
 .box {
   height: 100%;
   width: 100%;
-  padding: 20px 20px;
+  padding: 1.25rem 1.25rem;
   font-size: 0.8rem;
   display: flex;
   flex-direction: column;
@@ -304,7 +304,7 @@ onMounted(() => {
     width: 100%;
     background-image: url(../../../assets/img/title.png);
     background-size: 100% 100%;
-    height: 40px;
+    height: 2.5rem;
     display: flex;
     justify-content: center;
     align-items: center;
diff --git a/src/view/delivery/components/right.vue b/src/view/delivery/components/right.vue
index b88ee5d..a83fa5a 100644
--- a/src/view/delivery/components/right.vue
+++ b/src/view/delivery/components/right.vue
@@ -62,7 +62,7 @@ onUnmounted(() => {
       <div class="title">配送商品排行榜</div>
       <div
         style="
-          height: calc(100% - 60px);
+          height: calc(100% - 3.75rem);
           width: 100%;
           overflow: hidden;
           position: relative;
@@ -97,7 +97,7 @@ onUnmounted(() => {
 
 <style scoped lang="scss">
 .box {
-  padding: 20px;
+  padding: 1.25rem;
   font-size: 0.8rem;
   display: flex;
   flex-direction: column;
@@ -111,7 +111,7 @@ onUnmounted(() => {
     width: 100%;
     background-image: url(../../../assets/img/title.png);
     background-size: 100% 100%;
-    height: 40px;
+    height: 2.5rem;
     display: flex;
     justify-content: center;
     align-items: center;
@@ -136,9 +136,9 @@ onUnmounted(() => {
       display: flex;
       justify-content: space-between;
       align-items: center;
-      padding: 0 10px;
+      padding: 0 0.63rem;
       .rank {
-        width: 50px;
+        width: 3.1rem;
         height: 1.5em;
       }
       .rank1 {
diff --git a/src/view/delivery/index.vue b/src/view/delivery/index.vue
index 5140fb1..8672253 100644
--- a/src/view/delivery/index.vue
+++ b/src/view/delivery/index.vue
@@ -35,7 +35,7 @@ import rightItem from "./components/right.vue";
     /* border: 1px solid red; */
     & > .div {
       box-sizing: border-box;
-      padding: 10px;
+      padding: 0.63rem;
     }
   }
   .item_c {
diff --git a/src/view/index/components/centerItem2.vue b/src/view/index/components/centerItem2.vue
index f62267e..f8151bb 100644
--- a/src/view/index/components/centerItem2.vue
+++ b/src/view/index/components/centerItem2.vue
@@ -201,18 +201,18 @@ onMounted(() => {
 <style scoped lang="scss">
 .box {
   height: 88%;
-  padding: 20px;
+  padding: 1.25rem;
   font-size: 0.8rem;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   align-items: center;
-  width: calc(100% - 40px);
+  width: calc(100% - 2.5rem);
   .title {
     width: 100%;
     background-image: url(../../../assets/img/title2.png);
     background-size: 100% 100%;
-    height: 40px;
+    height: 2.5rem;
     display: flex;
     justify-content: center;
     align-items: center;
@@ -222,7 +222,7 @@ onMounted(() => {
   .box-c {
     flex: 1;
     width: 100%;
-    height: calc(100% - 80px);
+    height: calc(100% - 5rem);
     display: flex;
     justify-content: space-between;
     .left {
diff --git a/src/view/index/components/leftItme1.vue b/src/view/index/components/leftItme1.vue
index f7feb2c..231cee2 100644
--- a/src/view/index/components/leftItme1.vue
+++ b/src/view/index/components/leftItme1.vue
@@ -202,7 +202,7 @@ onMounted(() => {
   height: 100%;
   width: 100%;
   box-sizing: border-box;
-  padding: 20px 20px;
+  padding: 1.25rem 1.25rem;
   font-size: 0.8rem;
   display: flex;
   flex-direction: column;
@@ -212,7 +212,7 @@ onMounted(() => {
     width: 100%;
     background-image: url(../../../assets/img/title.png);
     background-size: 100% 100%;
-    height: 40px;
+    height: 2.5rem;
     display: flex;
     justify-content: center;
     align-items: center;
@@ -224,9 +224,9 @@ onMounted(() => {
     justify-content: center;
     width: 100%;
     height: 10%;
-    margin-top: 10px;
+    margin-top: 0.63rem;
     .my-num-item {
-      margin-right: 10px;
+      margin-right: 0.63rem;
       width: 4rem;
       height: 4rem;
       background-image: url(../../../assets/img/day_num.png);
@@ -241,7 +241,7 @@ onMounted(() => {
   .order-list {
     height: 55%;
     width: 100%;
-    margin-top: 10px;
+    margin-top: 0.63rem;
     .top {
       height: 10%;
       width: 100%;
@@ -283,7 +283,7 @@ onMounted(() => {
 
     :deep(.ceil) {
       padding: 0 !important;
-      margin-bottom: 5px;
+      margin-bottom: 0.3rem;
     }
 
     :deep(.header-item) {
diff --git a/src/view/index/components/leftItme2.vue b/src/view/index/components/leftItme2.vue
index ad89128..f7c422b 100644
--- a/src/view/index/components/leftItme2.vue
+++ b/src/view/index/components/leftItme2.vue
@@ -60,7 +60,7 @@ onUnmounted(() => {
       <div class="title">订单排行榜</div>
       <div
         style="
-          height: calc(100% - 60px);
+          height: calc(100% - 3.75rem);
           width: 100%;
           overflow: hidden;
           position: relative;
@@ -96,14 +96,14 @@ onUnmounted(() => {
   flex-direction: column;
   justify-content: space-between;
   align-items: center;
-  padding: 20px;
+  padding: 1.25rem;
   box-sizing: border-box;
 
   .title {
     width: 100%;
     background-image: url(../../../assets/img/title.png);
     background-size: 100% 100%;
-    height: 40px;
+    height: 2.5rem;
     display: flex;
     justify-content: center;
     align-items: center;
@@ -128,9 +128,9 @@ onUnmounted(() => {
       display: flex;
       justify-content: space-between;
       align-items: center;
-      padding: 0 10px;
+      padding: 0 0.63rem;
       .rank {
-        width: 50px;
+        width: 3.1rem;
         height: 1.5em;
       }
       .rank1 {
diff --git a/src/view/index/components/rightItem1.vue b/src/view/index/components/rightItem1.vue
index cc6f721..8736394 100644
--- a/src/view/index/components/rightItem1.vue
+++ b/src/view/index/components/rightItem1.vue
@@ -106,7 +106,7 @@ onMounted(() => {
 
 <style scoped lang="scss">
 .box {
-  padding: 20px;
+  padding: 1.25rem;
   font-size: 0.8rem;
   display: flex;
   flex-direction: column;
@@ -120,7 +120,7 @@ onMounted(() => {
     width: 100%;
     background-image: url(../../../assets/img/title.png);
     background-size: 100% 100%;
-    height: 40px;
+    height: 2.5rem;
     display: flex;
     justify-content: center;
     align-items: center;
@@ -134,7 +134,7 @@ onMounted(() => {
     display: flex;
     .car {
       flex: 1;
-      margin-top: 10px;
+      margin-top: 0.63rem;
       display: flex;
       flex-direction: column;
       font-size: 1rem;
diff --git a/src/view/index/components/rightItem2.vue b/src/view/index/components/rightItem2.vue
index 52a4114..39aef8d 100644
--- a/src/view/index/components/rightItem2.vue
+++ b/src/view/index/components/rightItem2.vue
@@ -60,7 +60,7 @@ onUnmounted(() => {
       <div class="title">配送商品排行榜</div>
       <div
         style="
-          height: calc(100% - 60px);
+          height: calc(100% - 3.75rem);
           width: 100%;
           overflow: hidden;
           position: relative;
@@ -102,14 +102,14 @@ onUnmounted(() => {
   flex-direction: column;
   justify-content: space-between;
   align-items: center;
-  padding: 20px;
+  padding: 1.25rem;
   box-sizing: border-box !important;
 
   .title {
     width: 100%;
     background-image: url(../../../assets/img/title.png);
     background-size: 100% 100%;
-    height: 40px;
+    height: 2.5rem;
     display: flex;
     justify-content: center;
     align-items: center;
@@ -134,10 +134,10 @@ onUnmounted(() => {
       display: flex;
       justify-content: space-between;
       align-items: center;
-      padding: 0 10px;
+      padding: 0 0.63rem;
 
       .rank {
-        width: 50px;
+        width: 3.1rem;
         height: 1.5em;
       }
       .rank1 {
diff --git a/src/view/index/index.vue b/src/view/index/index.vue
index fd1c6f8..e82f186 100644
--- a/src/view/index/index.vue
+++ b/src/view/index/index.vue
@@ -39,7 +39,7 @@ import rightItem2 from "./components/rightItem2.vue";
     /* border: 1px solid red; */
     & > .div {
       box-sizing: border-box;
-      padding: 10px;
+      padding: 0.63rem;
     }
   }
   .item_c {