背景图适配

pages/Pay/css/pay.css

@@ -1,11 +1,15 @@
+page {
+  height: 100%;
+}
+
 .container {
   position: relative;
-  width: 750rpx;
-  height: 1334rpx;
+  width: 100%;
+  height: 100%;
   font-family: "MicrosoftYaHei";
   font-weight: 400;
   background-image: url(../../static/images/bg.png);
-  background-size: 100% 100%;
+  background-size: cover;
   background-attachment: fixed;
   background-repeat: no-repeat;
 }
@@ -106,7 +110,7 @@
 .container .messageCard .item-form .item-pay .ite {
   display: inline-block;
   width: 200rpx;
-  height: 60rpx;
+  height: 80rpx;
   line-height: 89rpx;
   margin-left: 20rpx;
   font-size: 32rpx;
@@ -118,7 +122,7 @@
 .container .messageCard .item-form .item-pay .content {
   display: inline-block;
   width: 400rpx;
-  height: 60rpx;
+  height: 80rpx;
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
@@ -198,7 +202,7 @@
   flex-direction: column;
   justify-content: flex-start;
   position: absolute;
-  top: 384rpx;
+  top: 284rpx;
   left: 50%;
   transform: translateX(-325rpx);
   width: 650rpx;
@@ -318,7 +322,7 @@
   flex-direction: column;
   justify-content: flex-start;
   position: absolute;
-  top: 301rpx;
+  top: 201rpx;
   left: 50%;
   transform: translateX(-325rpx);
   width: 650rpx;

pages/Pay/css/pay.scss

@@ -1,11 +1,14 @@
+page {
+    height: 100%;
+}
 .container {
     position: relative;
-    width: 750rpx;
-    height: 1334rpx;
+    width: 100%;
+    height: 100%;
     font-family: "MicrosoftYaHei";
     font-weight: 400;
     background-image: url(../../static/images/bg.png);
-    background-size: 100% 100%;
+    background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     &::-webkit-scrollbar {
@@ -89,7 +92,7 @@
                 .ite {
                     display: inline-block;
                     width: 200rpx;
-                    height: 60rpx;
+                    height: 80rpx;
                     line-height: 89rpx;
                     margin-left: 20rpx;
                     font-size: 32rpx;
@@ -99,7 +102,7 @@
                 .content {
                     display: inline-block;
                     width: 400rpx;
-                    height: 60rpx;
+                    height: 80rpx;
                     overflow: hidden; //多出部分隐藏
                     white-space: nowrap; //一行显示
                     text-overflow: ellipsis; //是否显示省略号
@@ -178,7 +181,7 @@
         flex-direction: column;
         justify-content: flex-start;
         position: absolute;
-        top: 384rpx;
+        top: 284rpx;
         left: 50%;
         transform: translateX(-325rpx);
         width: 650rpx;
@@ -284,7 +287,7 @@
         flex-direction: column;
         justify-content: flex-start;
         position: absolute;
-        top: 301rpx;
+        top: 201rpx;
         left: 50%;
         transform: translateX(-325rpx);
         width: 650rpx;

pages/order/css/order.css

@@ -1,9 +1,13 @@
+page {
+  height: 100%;
+}
+
 .container {
   position: relative;
-  width: 750rpx;
-  height: 1334rpx;
+  width: 100%;
+  height: 100%;
   background-image: url(../../static/images/bg.png);
-  background-size: 100% 100%;
+  background-size: cover;
   background-attachment: fixed;
   background-repeat: no-repeat;
   box-sizing: border-box;
@@ -192,7 +196,7 @@
   flex-direction: column;
   justify-content: flex-start;
   position: absolute;
-  top: 301rpx;
+  top: 196rpx;
   left: 50%;
   transform: translateX(-325rpx);
   width: 650rpx;

pages/order/css/order.scss

@@ -1,9 +1,12 @@
+page {
+    height: 100%;
+}
 .container {
     position: relative;
-    width: 750rpx;
-    height: 1334rpx;
+    width: 100%;
+    height: 100%;
     background-image: url(../../static/images/bg.png);
-    background-size: 100% 100%;
+    background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     box-sizing: border-box;
@@ -169,7 +172,7 @@
         flex-direction: column;
         justify-content: flex-start;
         position: absolute;
-        top: 301rpx;
+        top: 196rpx;
         left: 50%;
         transform: translateX(-325rpx);
         width: 650rpx;

pages/parentPay/css/parentPay.css

@@ -1,6 +1,10 @@
+page {
+  height: 100%;
+}
+
 .container {
-  width: 750rpx;
-  height: 1334rpx;
+  width: 100%;
+  height: 100%;
 }
 
 .container::-webkit-scrollbar {
@@ -40,7 +44,7 @@
   font-family: "MicrosoftYaHei";
   font-weight: 400;
   background-image: url(../../static/images/bg.png);
-  background-size: 100% 100%;
+  background-size: cover;
   background-attachment: fixed;
   background-repeat: no-repeat;
 }
@@ -136,7 +140,7 @@
   flex-direction: column;
   justify-content: flex-start;
   position: absolute;
-  top: 384rpx;
+  top: 284rpx;
   left: 50%;
   transform: translateX(-325rpx);
   width: 650rpx;
@@ -262,7 +266,7 @@
   font-family: "MicrosoftYaHei";
   font-weight: 400;
   background-image: url(../../static/images/bg.png);
-  background-size: 100% 100%;
+  background-size: cover;
   background-attachment: fixed;
   background-repeat: no-repeat;
 }
@@ -318,7 +322,7 @@
 .content2 .messageCard .item-form .item-pay .ite {
   display: inline-block;
   width: 200rpx;
-  height: 60rpx;
+  height: 80rpx;
   line-height: 89rpx;
   margin-left: 20rpx;
   font-size: 32rpx;
@@ -330,7 +334,7 @@
 .content2 .messageCard .item-form .item-pay .content {
   display: inline-block;
   width: 400rpx;
-  height: 60rpx;
+  height: 80rpx;
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
@@ -410,7 +414,7 @@
   flex-direction: column;
   justify-content: flex-start;
   position: absolute;
-  top: 301rpx;
+  top: 201rpx;
   left: 50%;
   transform: translateX(-325rpx);
   width: 650rpx;

pages/parentPay/css/parentPay.scss

@@ -1,6 +1,9 @@
+page {
+    height: 100%;
+}
 .container {
-    width: 750rpx;
-    height: 1334rpx;
+    width: 100%;
+    height: 100%;
     &::-webkit-scrollbar {
         width: 16px;
         height: 16px;
@@ -34,7 +37,7 @@
     font-family: "MicrosoftYaHei";
     font-weight: 400;
     background-image: url(../../static/images/bg.png);
-    background-size: 100% 100%;
+    background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     .mark {
@@ -121,7 +124,7 @@
         flex-direction: column;
         justify-content: flex-start;
         position: absolute;
-        top: 384rpx;
+        top: 284rpx;
         left: 50%;
         transform: translateX(-325rpx);
         width: 650rpx;
@@ -233,7 +236,7 @@
     font-family: "MicrosoftYaHei";
     font-weight: 400;
     background-image: url(../../static/images/bg.png);
-    background-size: 100% 100%;
+    background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     .mark {
@@ -278,7 +281,7 @@
                 .ite {
                     display: inline-block;
                     width: 200rpx;
-                    height: 60rpx;
+                    height: 80rpx;
                     line-height: 89rpx;
                     margin-left: 20rpx;
                     font-size: 32rpx;
@@ -288,7 +291,7 @@
                 .content {
                     display: inline-block;
                     width: 400rpx;
-                    height: 60rpx;
+                    height: 80rpx;
                     overflow: hidden; //多出部分隐藏
                     white-space: nowrap; //一行显示
                     text-overflow: ellipsis; //是否显示省略号
@@ -366,7 +369,7 @@
         flex-direction: column;
         justify-content: flex-start;
         position: absolute;
-        top: 301rpx;
+        top: 201rpx;
         left: 50%;
         transform: translateX(-325rpx);
         width: 650rpx;