diff --git a/ui/src/views/404/index.vue b/ui/src/views/404/index.vue
index 60c654c4b..2ebb02c3d 100644
--- a/ui/src/views/404/index.vue
+++ b/ui/src/views/404/index.vue
@@ -1,7 +1,7 @@
 <template>
   <el-row class="not-found-container">
-    <el-col class="img" :span="12"> </el-col>
-    <el-col class="message-container" :span="12">
+    <el-col class="img" :xs="0" :sm="0" :md="12" :lg="12" :xl="12"> </el-col>
+    <el-col class="message-container" :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
       <div class="title">404</div>
       <div class="message">很抱歉，无法访问应用！</div>
       <!-- <div class="operate"><el-button type="primary" @click="router.push('/')">返回首页</el-button></div> -->
@@ -41,4 +41,9 @@ const router = useRouter()
     }
   }
 }
+@media only screen and (max-width: 1000px) {
+  .not-found-container .message-container {
+    text-align: center;
+  }
+}
 </style>