增加teacher登陆和teacher主页

Html/static/css/login.css

@@ -41,6 +41,27 @@ body {
     margin-bottom: 20px;
 }
 
+.login-switch {
+    display: flex;
+    justify-content: space-around;
+    margin-bottom: 20px;
+}
+
+.switch-btn {
+    background-color: #2575fc;
+    color: white;
+    padding: 10px 20px;
+    font-size: 16px;
+    border: none;
+    border-radius: 8px;
+    cursor: pointer;
+    transition: background-color 0.3s;
+}
+
+.switch-btn:hover {
+    background-color: #6a11cb;
+}
+
 .login-form {
     display: flex;
     flex-direction: column;
@@ -72,7 +93,34 @@ body {
     border-color: #2575fc;
     outline: none;
 }
+/* 基本按钮样式 */
+.role-btn {
+    background-color: #2575fc; /* 默认的蓝色背景（学生登录） */
+    color: white;
+    border: none;
+    border-radius: 8px;
+    padding: 10px 20px;
+    font-size: 16px;
+    cursor: pointer;
+    transition: background-color 0.3s, transform 0.3s;  /* 背景色平滑过渡，按钮缩放 */
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+}
 
+/* 按钮悬停效果 */
+.role-btn:hover {
+    background-color: #6a11cb; /* 悬停时变为深蓝色 */
+    transform: scale(1.05); /* 按钮放大效果 */
+}
+
+/* 切换到教师登录时的背景色 */
+.teacher-login .role-btn {
+    background-color: #005848; /* 深蓝色背景（教师登录） */
+}
+
+/* 切换到教师登录时的悬停效果 */
+.teacher-login .role-btn:hover {
+    background-color: #017c6e; 
+}
 .login-btn {
     background-color: #2575fc;
     color: white;
@@ -82,6 +130,10 @@ body {
     border-radius: 8px;
     cursor: pointer;
     transition: background-color 0.3s;
+    width: 100%;
+    margin-top: 30px;
+    margin-bottom: 30px;
+
 }
 
 .login-btn:hover {