记录学习前端HTML里面的form表单标签，单选框，多选框，数字框，下拉框，多行文本框，按钮标签
文章目录
- 一、表单标签
- 二、单选框
- 三、多选框
- 四、数字框
- 五、下拉框
- 六、多行文本域
- 七、按钮
- 八、datalist标签
正文内容：
一、表单标签
表单标签是form标签，包含action属性，指定表单提交的目标地址；method属性，指定提交表单的方式（get或者post）
表单需要提交数据，则使用input输入框标签进行提交，包含type属性，指定输入框的类型；placeholder属性，指定输入框的提示信息
表单输入框前面需要给出显示信息提示用户输入框输入的内容，则使用lable标签；lable标签包含属性for属性，可以将lable标签与input标签通过input标签的id属性进行绑定
范例代码：
表单学习
效果图如下所示：
二、单选框
在注册页面，对于性别的选择需要使用单选框进行；可以使用input标签，设置其type属性为radio，然后设置name属性；单选框有多个子选项，需要将这些子选项的name属性值设置相同；name属性将子选项进行了分组，相同的name则表示是同一组内容；name属性也是前端提交数据到后端时的参数字段名称；input标签默认是文本输入框，如果设置type属性为radio后，则需要通过value属性将值进行绑定
三、多选框
如果需要多种选项同时被选择，则需要使用多选框；多选框则是将input标签的type属性更改为checkbox；用法与单选框类似
四、数字框
当输入框中只需要输入数字时，使用数字框；此时使用input标签，并将其type属性值设置为number
五、下拉框
下拉框是使用select标签，用select标签包裹option标签实现；设置select标签的name属性用于传递数据到后端，name属性值是后端接受时的参数字段名称；option标签设置value属性绑定下拉框值，这里的值是传递到后端的具体数据
六、多行文本域
当需要输入多行文本内容的时候，则使用textarea标签，包含cols属性定义标签所占列数， rows属性定义标签所占行数
七、按钮
button标签默认的type属性值是submit，用于将表单数据提交到目标地址
1~7标签的使用范例代码如下：
表单学习
效果图如下所示：
八、datalist标签
input标签新增属性list，用于定义数据列表，使用datalist标签定义数据源；input标签的list属性值与datalist标签的id属性值一致
范例代码如下：
video标签练习
效果图如下所示：
