HTML表单标签

HTML表单标签作用：收集用户信息，例如登录、注册、搜索等场景。

1. input标签

语法：<input  type="...">

input标签type属性值不同，则功能不同。

占位文本

作用：提示信息

<input  type="..."  placeholder="提示信息">

2. 单选框radio

单选radio需要通过name属性来分组。

<input type="radio" name="gender" checked>男
<input type="radio" name="gender">女

3.多选框checkbox

多选框也叫复选框，默认选中：checked。

<input type="checkbox" checked">内容

4. 上传文件file

默认情况下，文件上传表单控件只能上传一个文件，添加multiple属性可以实现文件多选功能。

<input type="file" multiple>

5. 下拉菜单

语法：标签:select嵌套option，select是下拉菜单整体，option是下拉菜单的每一项。

<select>
 <option>北京</option>
 <option>上海</option>
 <option>广州</option>
 <option>深圳</option>
 <option selected>武汉</option>
</select>

6. 文本域

作用：多行输入文本的表单控件。

标签：<textarea>默认提示文字</textarea>

7. label标签

作用：网页中，某个标签的说明文本

增大点击范围：用label标签绑定文字和表单控件的关系，增大表单控件的点击范围。

• 写法1：

label标签只包裹内容，不包裹表单控件。

设置label标签的for属性值和表单控件的id属性值相同。

<input type="radio" id="man"><label for="man">男</label>

• 写法2：

使用label标签包裹文字和表单控件，不需要属性。

<label><input type="radio">女</label>

8. 按钮button标签

语法：<button type="">按钮</button>

type属性值：