利用Html给我输出一个有丰富信息的表单页面
时间: 2024-09-14 15:06:58 浏览: 28
一个基于html5的表单.zip
HTML是一种用于创建网页的标准标记语言,构建表单页面可以帮助用户输入数据并提交到服务器。下面是一个基本的HTML表单示例,包含了丰富的元素,如文本框、复选框、单选按钮、下拉列表以及提交按钮:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>丰富信息表单</title>
</head>
<body>
<form action="/submit-form" method="post">
<!-- 用户名 -->
<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>
<!-- 邮箱 -->
<label for="email">邮箱:</label>
<input type="email" id="email" name="email" required pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,}$"><br>
<!-- 性别选择 -->
<label for="gender">性别:</label>
<input type="radio" id="male" name="gender" value="male" checked>
<label for="male">男</label>
<input type="radio" id="female" name="gender" value="female">
<label for="female">女</label><br>
<!-- 地区选择 -->
<label for="region">地区:</label>
<select id="region" name="region">
<option value="north">北方</option>
<option value="south">南方</option>
<option value="east">东方</option>
<option value="west">西方</option>
</select><br>
<!-- 提交按钮 -->
<input type="submit" value="提交">
</form>
</body>
</html>
```
阅读全文