HTML表单通过form和input标签实现用户交互，使用action和method属性指定提交地址与方式，结合type类型与label标签可创建登录、注册等功能，合理设置required、name等属性提升可用性与数据准确性。
在网页开发中，HTML 表单是用户与网站交互的重要方式，常用于登录、注册、搜索、提交信息等场景。通过 form 和 input 标签，可以轻松创建功能完整的表单。
创建基本表单结构
使用 <form> 标签定义一个表单容器，它包含多个输入字段，并指定数据提交的目标地址和方法。
常用属性：
- action：表单提交的 URL 地址
- method：提交方式，通常为 get 或 post
<!-- 输入字段放在这里 -->
</form>
添加常用输入字段
<input> 是表单中最常用的标签，通过 type 属性定义输入类型。
立即学习“前端免费学习笔记（深入）”；
常见类型及用途：
- type="text"：单行文本输入，如用户名
- type="password"：密码输入，内容隐藏
- type="email"：邮箱输入，自动校验格式
- type="number"：只能输入数字
- type="checkbox"：复选框，可多选
- type="radio"：单选按钮，配合 name 分组
- type="file"：文件上传
- type="submit"：提交按钮
示例代码：
<label>用户名：<input type="text" name="username" required></label><br><label>密码：<input type="password" name="password" required></label><br>
<label>邮箱：<input type="email" name="email"></label><br>
<input type="submit" value="提交">
提升表单可用性的小技巧
合理设置字段属性和标签，能显著提升用户体验和数据准确性。
- 使用 <label> 关联文字说明，点击文字也能聚焦输入框
- 为必填项添加 required 属性，防止漏填
- 用 name 属性定义字段名，服务器靠它识别数据
- 为单选按钮设置相同 name，实现互斥选择
- 限制输入长度：使用 maxlength 属性
增强示例：
<label><input type="radio" name="gender" value="male"> 男
</label>
<label>
<input type="radio" name="gender" value="female"> 女
</label>
基本上就这些。掌握 form 和 input 的基本用法，就能构建出满足大多数需求的网页表单。不复杂但容易忽略细节，比如 label 的正确使用和 name 属性的命名规范。
