html用户登录注册界面代码
时间: 2024-09-26 15:09:09 浏览: 21
HTML用于创建静态网页内容,而用户登录和注册界面通常需要结合CSS样式和JavaScript动态交互。下面是一个简单的HTML结构示例,展示了基本的登录和注册表单:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>用户登录注册</title>
<link rel="stylesheet" href="styles.css"> <!-- 引入外部CSS样式 -->
</head>
<body>
<div class="login-register-container">
<h2>用户登录</h2>
<form id="login-form">
<label for="username">用户名:</label>
<input type="text" id="username" name="username" required>
<br>
<label for="password">密码:</label>
<input type="password" id="password" name="password" required>
<br>
<button type="submit">登录</button>
</form>
<hr>
<h2>新用户注册</h2>
<form id="register-form">
<label for="email">邮箱:</label>
<input type="email" id="email" name="email" required>
<br>
<label for="password2">确认密码:</label>
<input type="password" id="password2" name="password2" required>
<br>
<button type="submit">注册</button>
</form>
</div>
</body>
<script src="scripts.js"></script> <!-- 引入外部JavaScript脚本 -->
</html>
```
在这个例子中,`styles.css` 和 `scripts.js` 分别负责添加样式和处理表单提交等交互逻辑。
阅读全文