前言
我们前几期的文章中介绍了很多标签，而今天我们要介绍一种非常常见的标签–表单。可能有些朋友还不知道表单是什么，简单的说就是我们在网页中输入密码，用户名等信息的输入框和提交按钮。下面我们来具体说一说。
标签
表单
<form>
</form>
表单是由< form >< /form >标签声明，我们可以在其中添加属性和 组件，例如最基本的
| 属性 | 作用 |
|---|---|
| action | 此属性表示提交表单时要执行的操作，通常是将表单数据提交到服务器处理表单数据的文件脚本中。 |
| target | 提交数据后，服务器数据显示位置，默认_self在当前页面显示，_blank在新页面显示 |
| name | 表单名称 |
| action | 填写服务器地址 |
| method | 提交方式：get和post两种，默认get |
| autocomplete | 是否开启表单自动补全，开启则自动填入曾经输入的数据，默认开启 |
| novalidate | novalidate属性用于表单提交，表示在提交表单时不应该验证表单或输入域。 |
<form target="_self" method="get" autocomplete="on" name="表单">
<input type="email">
<input type="submit">
</form>
novalidate默认是检查的，可以将其设为true，将它关闭
表单相关元素
label标签
<label></label>
这是一种用于标记表单控件的HTML标签，通过与表单元素相关联，提供了可点击的文本标签。使用label标签可以提升表单的可用性和可访问性，同时还能使代码结构更清晰。
< label >标签中的for属性设置的字段要与< imput >标签中的id属性相同才能生效，否则需将< imput >放在< label >标签包裹内，则不用设置for和id
<label>不包裹，不使用for和id</label><input type="text">//无效
<label for="myInput1">不包裹，使用for和id</label><input type="text" id="myInput1">//有效
<label>包裹，不使用for和id<input type="text"></label>//有效
<label for="myInput2">包裹，使用for和id<input type="text" id="myInput2"></label>有效
< imput >标签
HTML的input标签是用于搜集用户输入信息的输入字段。
根据不同的type属性值，输入字段拥有很多种形式，如文本字段、复选框、掩码后的文本控件、单选按钮、按钮等。
| type | 作用 |
|---|---|
| text | 普通文本框，name属性设置提交数据名称，value设置初始值 |
| password | 密码框，输入内容会转化为黑点，name属性设置提交数据名称，value设置初始值 |
| submit | 提交按钮，value属性设置按钮名称，不设置则为submit |
| radio | 单选按钮，设置name和value属性表示提交数据，同一name属性值表示为一组内容；设置checked属性表示直接选中 |
| checkbox | 多选按钮，name，value，check属性与radio同，只是可以多选 |
| button | 普通按钮，value设置名称 |
<form target="_self" method="get" autocomplete="on">
<label for="my1">
姓名:<input type="text" id="my1" value="王">
</label><br>
<label for="my2">
密码:<input type="password" id="my2" value="1111111">
</label><br>
<label>
性别:
男:<input type="radio" name="r1" value="男">
女:<input type="radio" name="r1" value="女">
</label><br>
<label>
爱好:
篮球:<input type="checkbox" checked value="篮球" name="h">
足球:<input type="checkbox" checked value="足球" name="h">
羽毛球:<input type="checkbox" checked value="羽毛球" name="h">
乒乓球:<input type="checkbox" checked value="乒乓球" name="h">
</label><br>
<input type="button" value="按钮"><br>
<input type="submit" value="提交">
</form>
表单的样式多种多样，我们可以通过设置不同属性来让他更加美观好用，这期内容就先介绍到这里，我们下期再见！
