diff --git a/FrontEnd/admin.html b/FrontEnd/admin.html
index c7ae2e3..ba010d8 100644
--- a/FrontEnd/admin.html
+++ b/FrontEnd/admin.html
@@ -1,4 +1,7 @@
 <html>
+<head>
+<link rel="stylesheet" href="https://cdn.jsdmirror.com/npm/@picocss/pico@2/css/pico.min.css">
+</head>
 <body>
 <h1 align=center>管理</h1>
 </body>
diff --git a/FrontEnd/assignment.html b/FrontEnd/assignment.html
index db0899a..c7d21b0 100644
--- a/FrontEnd/assignment.html
+++ b/FrontEnd/assignment.html
@@ -1,4 +1,7 @@
-<html>
+<html data-theme="light">
+<head>
+<link rel="stylesheet" href="https://cdn.jsdmirror.com/npm/@picocss/pico@2/css/pico.min.css">
+</head>
 <body>
 <div>
 <h1 align=center>今日值班表</h1>
@@ -8,4 +11,55 @@
 </div>
 </body>
 <script src="/htmx.min.js"></script>
+<style>
+        table {
+            width: 100%;
+            border-collapse: collapse;
+            margin:auto
+        }
+        th, td {
+            border: 1px solid black;
+            padding: 8px;
+            text-align: center;
+        }
+        td:first-child, th:first-child {
+            background-color: #b3d9f7;
+            font-weight: bold;
+        }
+        td:nth-child(2), th:nth-child(2) {
+            background-color: #55ffaa
+        }
+        .ZoneHead {
+            display: inline-block;  /* 让颜色块和文字在同一行显示 */
+            width: 1em;  /* 设置颜色块的宽度为1个字的宽度 */
+            height: 1em; /* 设置颜色块的高度为1个字的高度 */
+            background-color: #55ffaa; /* 设置颜色块的背景颜色 */
+            vertical-align: middle; /* 让颜色块垂直居中 */
+            align-self: left;
+        }
+        .Moderator {
+            display: inline-block;  /* 让颜色块和文字在同一行显示 */
+            width: 1em;  /* 设置颜色块的宽度为1个字的宽度 */
+            height: 1em; /* 设置颜色块的高度为1个字的高度 */
+            background-color: #ffa0c9; /* 设置颜色块的背景颜色 */
+            vertical-align: middle; /* 让颜色块垂直居中 */
+        }
+        .SwitchOrRepay{
+            display: inline-block;  /* 让颜色块和文字在同一行显示 */
+            width: 1em;  /* 设置颜色块的宽度为1个字的宽度 */
+            height: 1em; /* 设置颜色块的高度为1个字的高度 */
+            background-color: #fff6b5; /* 设置颜色块的背景颜色 */
+            vertical-align: middle; /* 让颜色块垂直居中 */
+        }
+        .Volunteering{
+            display: inline-block;  /* 让颜色块和文字在同一行显示 */
+            width: 1em;  /* 设置颜色块的宽度为1个字的宽度 */
+            height: 1em; /* 设置颜色块的高度为1个字的高度 */
+            background-color: #c0ff85; /* 设置颜色块的背景颜色 */
+            vertical-align: middle; /* 让颜色块垂直居中 */
+        }
+        .table_notes{
+            align-items:left
+        }
+</style>
 </html>
diff --git a/FrontEnd/index.html b/FrontEnd/index.html
index b257685..9684091 100644
--- a/FrontEnd/index.html
+++ b/FrontEnd/index.html
@@ -1,4 +1,7 @@
 <html>
+<head>
+<link rel="stylesheet" href="https://cdn.jsdmirror.com/npm/@picocss/pico@2/css/pico.min.css">
+</head>
 <body >
 <div align=center>
 <h1>网维排班系统</h1>
diff --git a/templates/table.html b/templates/table.html
index fd8accf..0773bc8 100644
--- a/templates/table.html
+++ b/templates/table.html
@@ -13,55 +13,3 @@
 <i class="table_notes"><span class="SwitchOrRepay"></span>换班/补班<br></i>
 <i class="table_notes"><span class="Volunteering"></span>蹭班<br></i>
 <a href="/"><br><br>返回</a>
-
-    <style>
-        table {
-            width: 100%;
-            border-collapse: collapse;
-            margin:auto
-        }
-        th, td {
-            border: 1px solid black;
-            padding: 8px;
-            text-align: center;
-        }
-        td:first-child, th:first-child {
-            background-color: #b3d9f7;
-            font-weight: bold;
-        }
-        td:nth-child(2), th:nth-child(2) {
-            background-color: #55ffaa
-        }
-        .ZoneHead {
-            display: inline-block;  /* 让颜色块和文字在同一行显示 */
-            width: 1em;  /* 设置颜色块的宽度为1个字的宽度 */
-            height: 1em; /* 设置颜色块的高度为1个字的高度 */
-            background-color: #55ffaa; /* 设置颜色块的背景颜色 */
-            vertical-align: middle; /* 让颜色块垂直居中 */
-            align-self: left;
-        }
-        .Moderator {
-            display: inline-block;  /* 让颜色块和文字在同一行显示 */
-            width: 1em;  /* 设置颜色块的宽度为1个字的宽度 */
-            height: 1em; /* 设置颜色块的高度为1个字的高度 */
-            background-color: #ffa0c9; /* 设置颜色块的背景颜色 */
-            vertical-align: middle; /* 让颜色块垂直居中 */
-        }
-        .SwitchOrRepay{
-            display: inline-block;  /* 让颜色块和文字在同一行显示 */
-            width: 1em;  /* 设置颜色块的宽度为1个字的宽度 */
-            height: 1em; /* 设置颜色块的高度为1个字的高度 */
-            background-color: #fff6b5; /* 设置颜色块的背景颜色 */
-            vertical-align: middle; /* 让颜色块垂直居中 */
-        }
-        .Volunteering{
-            display: inline-block;  /* 让颜色块和文字在同一行显示 */
-            width: 1em;  /* 设置颜色块的宽度为1个字的宽度 */
-            height: 1em; /* 设置颜色块的高度为1个字的高度 */
-            background-color: #c0ff85; /* 设置颜色块的背景颜色 */
-            vertical-align: middle; /* 让颜色块垂直居中 */
-        }
-        .table_notes{
-            align-items:left
-        }
-    </style>
