HTML表单的基本组成
表单是网页中交互性最强、最重要的元素之一，也是用户输入信息最常用的界面。HTML 表单由许多不同的 HTML 标签组成，包括表单本身、输入元素、标签、按钮等。
1. 表单本身
表单的本身由 form 标签组成，它定义了一个可交互表单区域。通过表单的属性可以设置表单提交时的方法和地址等，同时可以给表单设置一个名称用于区分多个表单。
<form action='提交地址' method='提交方式' name='表单名称'>
……表单内容
</form>
其中，action 属性指定表单提交的目标 URL，method 属性指定请求的 HTTP 方式，name 属性指定表单的名称。下面介绍表单中常用的输入元素。
2. 输入元素
输入元素是用户在表单中用来输入或选择数据的元素。包括文本框、密码框、单选按钮、多选框、下拉列表、日期选择器等多种类型。
2.1 文本框和密码框
文本框和密码框由 input 标签构成。其中，type 属性值为 text 的是文本框，type 属性值为 password 的是密码框。value 属性指定了文本框或密码框中的默认值。
<label>用户名：
<input type='text' name='username' value='默认值'>
</label>
<label>密码：
<input type='password' name='password' value='默认值'>
</label>
2.2 单选按钮和多选框
单选按钮和多选框同样由 input 标签构成。其中，type 属性值为 radio 的是单选按钮，type 属性值为 checkbox 的是多选框。每个选项都需要使用 label 标签来绑定 input 标签。
<label>性别：
<input type='radio' name='gender' value='男' checked>男
<input type='radio' name='gender' value='女'>女
</label>
<label>爱好：
<input type='checkbox' name='hobby' value='篮球' checked>篮球
<input type='checkbox' name='hobby' value='足球'>足球
<input type='checkbox' name='hobby' value='游泳'>游泳
</label>
2.3 下拉列表
下拉列表由 select 和 option 组成。其中，select 标签定义了一个下拉列表框，option 标签定义了下拉列表中的选项。
<label>城市：
<select name='city'>
<option value='1'>北京</option>
<option value='2' selected>上海</option>
<option value='3'>广州</option>
</select>
</label>
2.4 日期选择器
HTML5 中新增了一个输入框类型为 date 的日期选择器。该输入框不需要使用 JavaScript 或其他插件，可以直接在 PC 和移动设备上使用。
<label>生日：
<input type='date' name='birthday'>
</label>
3. 标签
标签是表单中用来描述输入元素的文本。标签使用 label 标签来定义，每个 label 标签需要与一个对应的输入元素绑定。
<label>用户名：
<input type='text' name='username'>
</label>
4. 按钮
按钮用来在表单中触发某些操作，包括提交表单、重置表单等。按钮由 button 和 input 标签构成。
4.1 提交按钮
提交按钮用来提交表单，由 input 标签构成。type 属性值为 submit。
<input type='submit' name='submit' value='提交'>
4.2 重置按钮
重置按钮用来将输入元素的值重置为默认值，由 input 标签构成。type 属性值为 reset。
<input type='reset' name='reset' value='重置'>
总结
本文主要介绍了 HTML 表单的基本组成，包括表单本身、输入元素、标签、按钮等。通过以上的代码示例，我们可以更清晰地了解每个组成部分的使用方法和语法规则。在实际开发中，我们可以根据不同的需求选择适合的输入元素、标签和按钮来构建表单，从而实现更加丰富、更加完善的用户交互体验。