使用form标签定义表单结构，设置action、method等属性；2. 添加input字段并指定type类型如text、password、email等；3. 用label提升可访问性，确保点击文字可激活输入框；4. 结合textarea、select、button等控件完善功能。正确使用name属性和语义化标签是关键。
创建HTML表单是网页开发中的基础技能，主要用于收集用户输入信息，比如登录、注册、搜索等场景。一个完整的表单由 form 标签包裹，内部包含各种 input 元素和其他控件。下面介绍如何正确创建HTML表单并设置常用字段。
1. 使用 form 标签定义表单结构
每个表单都必须用 form 标签包裹，它定义了表单的提交方式和目标地址。
关键属性包括：
- action：指定表单数据提交到的URL
- method：提交方式，通常为 get 或 post
- enctype：上传文件时需设为 multipart/form-data
示例：
立即学习“前端免费学习笔记（深入）”；
<form action="/submit-form" method="post"><!-- 表单内容 -->
</form>
2. 添加 input 字段与常见类型
input 是最常用的表单元素，通过 type 属性定义输入类型。
常用类型包括：
- text：单行文本输入
- password：密码输入（隐藏字符）
- email：邮箱格式校验
- number：只能输入数字
- checkbox：多选框
- radio：单选按钮
- file：文件上传
- hidden：隐藏字段
示例代码：
<label>密码：<input type="password" name="password" required></label><br>
<label>邮箱：<input type="email" name="email"></label><br>
<input type="radio" name="gender" value="male"> 男
<input type="radio" name="gender" value="female"> 女<br>
<input type="checkbox" name="hobby" value="read"> 阅读
<input type="checkbox" name="hobby" value="music"> 音乐
3. 使用 label 提升可访问性
label 标签关联输入项，点击文字也能激活对应控件，对用户体验和无障碍支持很重要。
有两种写法：
- 包裹式：<label>文本 <input ...></label>
- for + id 关联：<label for="age">年龄</label><input id="age" type="number">
4. 其他常用表单控件
除了 input，还可以使用以下元素丰富表单功能：
- textarea：多行文本输入
- select 和 option：下拉选择框
- button 或 input type="submit"：提交按钮
示例：
立即学习“前端免费学习笔记（深入）”；
<textarea name="message" rows="4" placeholder="请输入留言"></textarea><br><select name="city">
<option value="">请选择城市</option>
<option value="beijing">北京</option>
<option value="shanghai">上海</option>
</select><br>
<input type="submit" value="提交">
基本上就这些。合理使用标签、属性和语义化结构，就能创建出功能完整、易于维护的HTML表单。不复杂但容易忽略细节，比如name属性缺失会导致数据无法提交。
