＜form＞表单标签

1.为什么需要表单？

使用表单的目的是为了收集用户信息。

在网页中，我们也需要跟用户进行交互，收集用户资料，此时需要表单。

2.表单的组成

表单域、表单控件（表单元素）和提示信息3部分构成。

表单域：就是一个包含表单元素的区域，<form>标签用于定义表单域，以实现用户信息的收集和传递。<form>会把它范围内的表单元素信息提交给服务器。

提示信息：就是类似于：姓名、年龄、身高等文字信息。

表单元素：允许用户在表单中  输入或者选择  的内容控件

---

表单元素主要分为3类：

input输入表单元素

select下拉表单元素

textarea文本域元素

<form action="url地址" method="提交方式" name="表单域名称">
各种表单元素控件
</form>

1.<input>输入表单元素

<input type="text">：type为必须属性，text为文本

<input type="password">：password为密码，用户看不见密码数字

<input type="radio">：定义单选按钮，只能选一，（要搭配name属性，才能实现）

---

其中还有辅助的属性

name----定义input元素的名称

value----规定input元素的值

checked-----规定input元素首次加载应被选中

---

<input type="chekbox">：重复多选

注意：其中性别单选按钮中必须要有相同的名字name,才能实现多选1

 checked属性：表示默认选中状态。用于单选按钮和复选按钮。

<input type="submit">---提交，<input type="reset">---重置

 注意：普通按钮button,常和js配合使用

<input type="button" value="获取短信验证码" />

 <input type="file">:用于文件上传

<label>标签：用来增加用户体验，（当<label>标签绑定一个表单元素，点击<label>标签的文本时，浏览器就会自动将焦点（光标）转到对应的表单元素上。

语法：for 和 id 是对应起来的

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

2.<select>下拉标签：

籍贯：
<select>
<option>山东</option>
<option>北京</option>
<option>南京</option>
</select>

注意：1.<select>中至少包含一对<option>

           2.在<option>中定义 selected="selected"时，当前选项即为默认选中项

 3.textarea文本域元素

使用场景：当用户输入内容较多的情况下，我们就不能使用文本框表单了，可以使用文本域<textarea>

<textarea cols="50" rows="5">
</textarea>

上面的代码花花绿绿的，其实是有规律的，刚学习的小白可以记住下面的小妙招

小妙招：红色--代表标签，黄色--代表属性，墨绿色--代表值