HTML基础知识（五）

一.表单标签

1.为什么需要表单

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

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

2.表单的组成

在HTML中，一个完整的表单通常由表单域、表单控件(也称为表单元素)和提示信息三部分构成。

1. 表单域

表单域是一个包含表单元素的区域。

在HTML标签中，<form>标签用于定义表单域，以实现用户信息的收集和传递。

<form>会把它范围内的表单元素信息提交给服务器。

实现代码：

<form   action=”url地址”   method=“提交方式”   name=“表单域名称”>各种表单元素

控件</form>

表单域常用属性

属性	属性值	作用
action	url地址	用于指定接收并处理表单数据的服务器程序的url地址
method	get/post	用于设置表单数据的提交方式，取其值为get或post
name	名称	用于指定表格的名称，以区分同一个页面中多个表单域

二.表单控件（表单元素）

1.input表单元素

在英文单词中，input是输入的意思，而在表单元素中<input>标签用于收集用户信息。

在<input>标签中，包含一个type属性，根据不同的type属性值，输入字段拥有很多种方式（可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等）。

<input   type=”属性值”/>

<input/>标签为单标签type属性设置不同的属性值用来指定不同的控件类型type属性的属性值及其描述如下：

属性值	描述
Button	定义可点击按钮（多数情况下，用于通过JavaScript启动脚本）
Checkbox	定义复选框
File	定义输入字段和“浏览”按钮，供文件上传。
Hidden	定义隐藏的输入字段
image	定义图像形式的提交按钮
Password	定义密码字段。该字符中的字符被淹码
Radio	定义单选按钮
Reset	定义重置按钮。重置按钮会清除表单中的所有数据
Submit	定义提交按钮。提交按钮会把表单数据发送到服务器
Text	定义单行输出字段，用户可在其中输入文本。默认宽度为20个字符

除type属性外，<input>标签还有其他很多属性，其常用属性如下：

属性	属性值	描述
Name	由用户自定义	定义input元素的名称
Value	由用户自定义	规定input元素的值
Checked	Checked	规定此input元素首次加载时应当被选中
Maxlength	正整数	规定输入字段中的字符的最大长度

三．Label标签

<label>标签为input元素定义标注（标签）。

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

<label   for="sex”>男</label>

<input   type="radio” name="sex”  id="sex”/>

核心：<label>标签的for属性应当与相关元素的id属性相同。

四．Select表单元素

使用场景：在页面中，如果有多个选项让用户选择，并且想要节省页面空间时，我们可以使用<select>标签控件定义下拉列表。

语法：