diff --git a/mcwl-admin/src/main/resources/templates/binding-fail.html b/mcwl-admin/src/main/resources/templates/binding-fail.html
index 6a3efc1..2c0d7f2 100644
--- a/mcwl-admin/src/main/resources/templates/binding-fail.html
+++ b/mcwl-admin/src/main/resources/templates/binding-fail.html
@@ -2,10 +2,56 @@
 <html lang="zh-CN">
 <head>
     <meta charset="UTF-8">
+    <!-- 添加视口元标签，确保在移动设备上正确缩放 -->
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
     <title>绑定失败</title>
+    <style>
+        body {
+            font-family: Arial, sans-serif;
+            background-color: #f4f4f9;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            height: 100vh;
+            margin: 0;
+            /* 防止在小屏幕上出现水平滚动条 */
+            overflow-x: hidden;
+        }
+        .container {
+            background-color: #ffffff;
+            padding: 20px;
+            border-radius: 8px;
+            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+            text-align: center;
+            width: 90%;
+            max-width: 400px;
+            /* 为小屏幕设备减少内边距 */
+            box-sizing: border-box;
+        }
+        h1 {
+            color: #ff6b6b;
+            font-size: clamp(20px, 5vw, 24px);
+            /* 使用 clamp 函数动态调整字体大小 */
+            margin-bottom: 10px;
+        }
+        p {
+            color: #555;
+            font-size: clamp(14px, 4vw, 16px);
+            /* 使用 clamp 函数动态调整字体大小 */
+            margin-top: 0;
+        }
+        /* 当屏幕宽度小于 320px 时进一步调整样式 */
+        @media (max-width: 320px) {
+            .container {
+                padding: 15px;
+            }
+        }
+    </style>
 </head>
 <body>
-<h1>支付宝账号绑定失败！</h1>
-<p>请检查您的网络或稍后重试。</p>
+    <div class="container">
+        <h1>支付宝账号绑定失败！</h1>
+        <p>请检查您的网络或稍后重试。</p>
+    </div>
 </body>
 </html>
\ No newline at end of file
diff --git a/mcwl-admin/src/main/resources/templates/binding-success.html b/mcwl-admin/src/main/resources/templates/binding-success.html
index da73c50..b752cda 100644
--- a/mcwl-admin/src/main/resources/templates/binding-success.html
+++ b/mcwl-admin/src/main/resources/templates/binding-success.html
@@ -2,10 +2,52 @@
 <html lang="zh-CN">
 <head>
     <meta charset="UTF-8">
+    <!-- 确保页面在移动设备上正确缩放 -->
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>绑定成功</title>
+    <style>
+        body {
+            font-family: Arial, sans-serif;
+            background-color: #f4f4f9;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            height: 100vh;
+            margin: 0;
+            overflow-x: hidden;
+        }
+        .container {
+            background-color: #ffffff;
+            padding: 20px;
+            border-radius: 8px;
+            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+            text-align: center;
+            width: 90%;
+            max-width: 400px;
+            box-sizing: border-box;
+        }
+        h1 {
+            color: #28a745;
+            font-size: clamp(20px, 5vw, 24px);
+            margin-bottom: 10px;
+        }
+        p {
+            color: #555;
+            font-size: clamp(14px, 4vw, 16px);
+            margin-top: 0;
+        }
+        /* 小屏幕适配 */
+        @media (max-width: 320px) {
+            .container {
+                padding: 15px;
+            }
+        }
+    </style>
 </head>
 <body>
-<h1>支付宝账号绑定成功！</h1>
-<p>您可以返回用户中心继续操作。</p>
+    <div class="container">
+        <h1>支付宝账号绑定成功！</h1>
+        <p>您可以返回用户中心继续操作。</p>
+    </div>
 </body>
 </html>
\ No newline at end of file
