学生管理系统登录注册主页面代码
时间: 2023-11-16 18:10:29 浏览: 34
以下是一个简单的学生管理系统的登录注册主页面代码示例:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>学生管理系统</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container">
<h1>学生管理系统</h1>
<div class="form-container">
<form id="login-form" class="form">
<h2>登录</h2>
<label for="username">用户名</label>
<input type="text" id="username" name="username" required>
<label for="password">密码</label>
<input type="password" id="password" name="password" required>
<button type="submit">登录</button>
</form>
<form id="register-form" class="form hidden">
<h2>注册</h2>
<label for="new-username">用户名</label>
<input type="text" id="new-username" name="new-username" required>
<label for="new-password">密码</label>
<input type="password" id="new-password" name="new-password" required>
<button type="submit">注册</button>
</form>
<div class="toggle-forms">
<button id="login-button" class="active">登录</button>
<button id="register-button">注册</button>
</div>
</div>
</div>
<script src="script.js"></script>
</body>
</html>
```
这段代码包括一个登录表单和一个注册表单,以及在它们之间切换的按钮。CSS和JavaScript代码可以根据自己的需求进行编写。
相关推荐
![cpp](https://img-home.csdnimg.cn/images/20210720083646.png)
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)