HTML表单通过<form>标签包裹，使用action和method属性定义提交地址与方式，结合input、select、textarea等控件收集用户数据，配合label和name属性提升可用性与识别性，如注册表单示例所示。
创建HTML表单是网页开发中的基础技能，主要用于收集用户输入的信息，比如登录、注册、搜索等场景。一个完整的HTML表单由多个元素组成，合理使用这些标签和属性能让表单更清晰、可用性更强。
HTML表单的基本结构
所有表单都必须包裹在 zuojiankuohaophpcnform> 标签内。这个标签定义了表单的起始和结束，并可通过属性设置数据提交的方式和目标地址。
基本语法如下：
<form action="submit.php" method="post"><!-- 表单控件放在这里 -->
</form>
action 属性指定表单提交后数据发送到的URL；method 属性决定请求方式，常用值为 get（参数显示在URL中）或 post（参数隐藏在请求体中）。
立即学习“前端免费学习笔记（深入）”；
常用的表单控件
表单控件用于接收不同类型的用户输入。以下是几种常见控件及其用途：
- <input type="text">：单行文本输入框，适合姓名、用户名等
- <input type="password">：密码输入框，输入内容会被隐藏
- <input type="email">：邮箱输入框，浏览器会进行格式校验
- <input type="radio">：单选按钮，同一组需设置相同 name 值
- <input type="checkbox">：复选框，可多选
- <select><option></option></select>：下拉选择菜单
- <textarea></textarea>：多行文本输入区域
- <input type="submit">：提交按钮，点击后发送表单数据
每个控件建议配合 <label> 标签使用，提升可访问性和用户体验。例如：
<label for="username">用户名：</label><input type="text" id="username" name="username">
name属性的重要性
表单提交时，服务器通过 name 属性识别各个字段。没有 name 的控件不会被提交。例如：
<input type="text" name="phone" placeholder="请输入电话号码">提交后，数据将以 phone=13800138000 的形式发送给服务器。
完整示例：用户注册表单
<form action="/register" method="post"><label>姓名：</label>
<input type="text" name="name" required><br><br>
<label>邮箱：</label>
<input type="email" name="email" required><br><br>
<label>性别：</label>
<input type="radio" name="gender" value="male" id="male">
<label for="male">男</label>
<input type="radio" name="gender" value="female" id="female">
<label for="female">女</label><br><br>
<label>兴趣：</label>
<input type="checkbox" name="hobby" value="read" id="read">
<label for="read">阅读</label>
<input type="checkbox" name="hobby" value="music" id="music">
<label for="music">音乐</label><br><br>
<label>简介：</label><br>
<textarea name="bio" rows="4" cols="30"></textarea><br><br>
<input type="submit" value="注册">
</form>
这个表单包含了文本输入、单选、复选、多行文本和提交按钮，是一个典型的注册页面结构。
基本上就这些，掌握 form 标签和常用 input 类型，就能构建出功能完整的HTML表单。不复杂但容易忽略细节，比如 name 属性和 label 关联，写的时候注意就好。
