input标签
一：什么是 input 标签
input，翻译过来就是 “输入” 的意思，在 HTML 中，大多数表单都是使用 input 标签来实现的。
说明：input 是自闭合标签，可以看到它是没有结束符号的。
二：input 标签中 type 属性取值
text 单行文本框 password 密码文本框 radio 单选框 checkbox 多选框 button、submit、reset 按钮 file 文件上传
text 单行文本框
单行文本框使用 input 标签来实现，type 属性的取值是 text ，比如常用于登陆注册功能。
<div>
姓名：<input type="text" />
</div>
单行文本框常用属性
| 属性 | 解释说明 |
|---|---|
| value | 设置默认情况下文本框显示的文字(默认值) |
| size | 设置文本框的长度 |
| maxlength | 设置文本框中最多可以输入的字符数 |
① value 属性 默认情况下，单行文本框的输入区域是空白的，如果想给该区域设置默认的显示文字，就要用到 value 属性
② size 属性 单行文本框的默认长度是 20 像素，如果想改变其默认长度，就要用到 size 属性，代码如下所示
③ maxlength 属性 我们注册一个账号，在输入用户昵称时，经常会提示最多输入多少个字，在单行文本框中，想要实现这个功能，就要使用 maxlength 属性。
password 密码文本框
密码文本框，从名字就可以看出来这是一个输入密码的文本框，type 取值为 password 。
密码：<input type="password" />
从外观上来看，密码文本框和单行文本框相似，你也可以把密码文本框看成是一种特殊的单行文本框。但当我们在输入框内输入字符后，我们就可以看到两者的区别。
在单行文本框中输入的字符可见，而在密码文本框中输入的字符是不可见的。这是两者本质上的区别。
密码文本框和单行文本框拥有相同的属性（value、size、maxlength），作用也是一致的，这里不再重复说明。
但需要特殊说明的是，密码文本框内的字符被黑色小圆点代替，这也只是让你旁边的人看不到你输入了什么，对数据的安全性来说是没一点作用的，浏览器和服务器之间数据的安全传输，属于后端技术。
radio 单选框
单选框使用 input 标签来实现，type 属性取值为 radio 。
这里的要用到属性 name 和 value
| 属性 | 解释说明 |
|---|---|
| name | 单选按钮所在的组名 |
| value | 单选按钮的取值 |
value 属性的取值一般跟后面的文本相同，虽然加不加 value 属性在显示效果上都是一样的，但之所以要加上，也是为了方便 JavaScript 或者是服务器来对数据进行操作，关于这点，所有表单元素的 value 属性的作用都是一致的。
<form>
性别
<input type="radio" name="sex" value="男" />男
<input type="radio" name="sex" value="女" />女
</form>
使用单选框的两个注意事项
-
注意事项一：不能忘记加 name 属性。
-
注意事项二：同一组的单选框，必须设置相同的 name。
这两个注意事项，犯了其中一项，都会导致单选框出现可以同时被选取的情况
checkbox 复选框
复选框使用 input 标签实现，type 属性的取值为 checkbox ，从名字可以很清楚的知道，复选框可以选择多项。
复选框的属性 name 和 value,和单选框其实是一样的，这两个属性也是必填项。
<form>
你最喜欢的运动 <br />
<input type="checkbox" name="anime" value="游泳" />游泳
<input type="checkbox" name="anime" value="足球" />足球
<input type="checkbox" name="anime" value="篮球" />篮球
<input type="checkbox" name="anime" value="乒乓球" />乒乓球
</form>
多选框默认不会选中任何选项，如果想在默认情况下，选中一个或者多个选项，也需要用到 checked 属性来实现，代码如下所示
<form>
你最喜欢的运动 <br />
<input type="checkbox" name="anime" value="游泳" checked />游泳
<input type="checkbox" name="anime" value="足球" checked/>足球
<input type="checkbox" name="anime" value="篮球" checked/>篮球
<input type="checkbox" name="anime" value="乒乓球" checked/>乒乓球
</form>
按钮
HTML 中，常见的按钮有三种，分别是普通按钮 button、提交按钮 submit 、重置按钮 reset
①：button 普通按钮
普通按钮一般是配合 JavaScript 来实现各种操作的
②：submit 提交按钮
提交按钮一般用来给服务器提交数据时使用，你可以把提交按钮看成是特殊的普通按钮。
③：reset 重置按钮
重置按钮一般用于清除表单中的内容，你同样可以把它看成是一种特殊的普通按钮。
可以看到，点击"重新填写"按钮，可以清空我们在输入框内输入的内容，这就是重置按钮的作用。
需要注意的是，重置按钮 reset 只能清空在 form 标签内的数据，对于 form 标签外的表单数据是无效的
file 文件上传
文件上传用 input 标签实现，type 属性的取值是 file。
像平常我们用到的百度网盘、各种邮箱都有上传文件的功能
这是本地文件的操作，如果想上传到网络，需要后台技术配合了
