<!-- action指定表单提交地址 -->
<!-- name为表单名（所有需要提交的数据必须有name属性） -->
<!-- method表示请求方式 -->
<form action="" name="" method="get/post">
<!-- fieldset用于对表单中的元素进行分组（自动有一个边框），可嵌套 -->
<fieldset>
<!-- legend可以在fieldset绘制的方框内插入一个标题（必须是fieldset内的第一个元素） -->
<legend> 基本信息 </legend>
<!-- 表单控件 -->
账号 <input type="text" />
</fieldset>
</form>
效果图：
表单控件写法
- 显示（方便布局）
<!-- id属性值和for属性值需要对应。可以在点击文字的时候触发输入框的焦点 -->
<input id="num" type="text" name="num" />
<label for="num">数量</label>
- 隐式
<label><input type="text" name="num" />数量</label>
表单控件
- 文本
<input type="text" placeholder="文本" />
- 密码
<input type="password" placeholder="密码" />
- 单选按钮
<!-- checked表示默认选中 -->
<input type="radio" checked />
- 复选框
<!-- disabled表示禁用 -->
<!-- 当属性值和属性名相同时，属性值可以忽略不写 -->
<input type="checkbox" name="apple" value="apple" disabled />
- 下拉列表
<select name="">
<!-- 分组 -->
<optgroup label="黑龙江省">
<!-- selected用于默认被选中 -->
<option value="大庆" selected></option>
<option value="哈尔滨"></option>
</optgroup>
</select>
- 多行文本框（可设置宽高）
<!-- cols表示列数 rows表示行数 -->
<!-- resize: none不可拖拽改变文本框大小 -->
<textarea name="" cols="10" rows="10" style="resize: none"></textarea>
- 重置按钮
<input type="reset" value='重置' />
- 提交按钮
<input type="submit" value='提交' />
- 普通按钮
<input type="button" value='按钮内容' />
- 上传文件
<!-- multiple表示多选 -->
<input type="file" multiple />
- 图片按钮
<!-- 默认提交功能 -->
<input type="image" src="" />
- 邮箱
<!-- 若输入框的内容不是email地址格式，则不允许提交 -->
<!-- 可输入一串以逗号分隔的email地址 -->
<!-- 提交时可为空 -->
<input type="email" />
- 电话
<!-- 可在移动端使用定制数字键盘 -->
<input type="tel" />
- url地址
<!-- 若输入框内容不是url地址格式，则不允许提交（http://） -->
<input type="url" value="地址" />
- 数字
<!-- step表示间隔数量，若不写则默认为1 -->
<input type="number" min="10" max="20" step="5" />
- 滑动条
<!-- onchange是JS响应滑动条的变化事件 -->
<!-- text.value = range.value可以让滑动条的数值在id为text的文字中显示 -->
<!-- step表示每次拖动的步幅 -->
<input id="range" type="range" min="10" max="200" step="2" onchange="text.value = range.value" />
<input id="text" type="text" />
- 日期、时间
- date 用于选取日、月、年
- month 用于选取月、年
- week 用于选取周、年
- time 用于选取时间（小时、分钟）
- datetime-local 用于选取时间、日、月、年（本地时间）
- 颜色
<!-- 选取颜色 -->
<input type="color" />
- 搜索框
<!-- 输入内容后右侧有一个X按钮，可点击取消 -->
<input type="search" />
