1. 表单的作用 表单在网页中主要负责数据采集功能。一个表单有三个基本组成部分： 表单标签：这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。 表单域：包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。 表单按钮：包括提交按钮、复位按钮和一般按钮；用于将数据传送到服务器上的CGI脚本或者取消输入，还可以用表单按钮来控制其他定义了处理脚本的处理工作。 ●表单标签 就像表格一样，需要有一个table标签 ●表单域 输入框、单选框、多选框、下拉框、密码框、文件上传、多行文本输入框 ●表单按钮 提交按钮、重置按钮、一般按钮 虽然表单有这么多功能，但是，我们前期学习只学习外观样式。 2. 表单标签 2.1. form标签 一个表单曾经需要用form包裹，现在因为前端有更好的技术实现数据交互，所以form标签不重要了，用不用form标签包裹，都可以。建议不用。 2.2. input input标签不代表某一种元素，使用input可以实现很多的效果。 2.2.1. type="text" 表示文本输入框，可以输入单行文本

2.2.2. type="password" 表示密码框，可以输入密文，输入的内容用黑点展示。

密码输入框安全吗？自己的电脑上尽量不要用密码保存功能，别人只要修改输入框中的type类型，密码就会显示。 占位 placeholder 通常我们的输入框中会提示要输入的内容。需要使用placeholder属性 没内容时，占位显示，有内容时占位消失。

2.2.3. type="radio" 单选框，默认情况下，单选框时未选中状态。同时单选框默认不会有单选效果，所有的单选框都会被选中。 name属性 name属性可以给任意的input添加，对于其他input暂时没有什么作用。但是如果想要让多个radio有单选效果，就必须给对应的单选框添加相同的name属性，值可以为任意值。

checked属性 添加给单选或者多选后，可以让对应的选择框默认被选中只有属性没有属性值 2.2.4. type="checkbox" 用来在页面上实现多选框

多选也能通过checked属性设置默认选中状态。 disabled 这个属性可以任意的表单元素添加，让用户不能对某些表单元素进行操作。

readonly 只读属性，表示这个输入框没有办法输入内容，只能阅读内部的内容。一般不用。 2.2.5. type="file" 很多时候，我们的网页上需要进行文件的上传操作，比如头像等。就需要使用文件上传组件

现在我们不能实现真正的上传文件的操作，想要实现还需要结合JS和后台一起，才能实现。 2.2.6. 下拉框 下拉框不属于input，是单独的标签。需要多个标签才能实现下拉框操作 select + option

选项1

选项2

选项3

选项4

这个东西在练习时用一用还行，因为样式无法修改，所以未来项目中需要自己模拟select(结合css) label标签 配合表单元素来实现，点击文本也能让对应的表单元素获取焦点的功能。 我们要使用label属性，包裹我们input旁边的文本 该标签有一个属性，叫for，这个属性的属性值，如果和对应的某个input的id值相同的话，就能实现对应的效果了。

男