表单定义：将用户信息等本地的数据信息提交给服务器的，比如：百度的搜索框 注册 登录这些操作都需要填写表单
一、创建表单 form标签
属性：action属性（必须要写）
指向的是一个服务器的地址，当我们提交表单时将会提交到action属性对应的地址
二:添加表单项
使用form创建的仅仅是一个空白的表单，我们还需要向form中添加不同的表单项
（1）input来创建一个文本框，type属性是text，name属性：提交内容的名字
如果希望表单项中的数据会提交到服务器中，必须指定一个name属性，value属性值：作为文本框的默认值显示
（2）input创建一个密码框，type属性值是password，name属性：提交密码的名字
（3）input创建一个单选按钮
- type属性：radio- name属性进行分组，属性相同是一组按钮，如果不设置，则都可以选择
- value属性必须设置，这样被选中的表单项的value属性值将会最终提交给服务器
-checked="checked"属性 默认选中
（4）input创建一个多选框
-type属性:checkbox
-checked="checked"属性 默认选中
(5)select来创建一个下拉列表
-name属性设置给select，
-value属性设置给option
-selected="selected"，将选项设置为默认选中
（6）textarea创建一个文本域
（7）input创建一个提交按钮，点击后表单就会提交
-type属性值：submit
-value属性：指定按钮上的文字
（8）input创建一个重置按钮，type="reset"
点击重置按钮以后表单中内容将会恢复为默认值
（9）input创建一个单纯的按钮，type="button"
这个按钮没有任何功能，只能被点击
（10）button标签来创建按钮 type="submit" type="reset" type="button"
方式和使用input类似，它是成对出现的标签，使用起来更加的灵活
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<form action="target.html">
用户名
<input type="text" name="username" /> <br /><br />
密码
<input type="password" name="password" /> <br /><br />
性别
<input type="radio" name="gender" value="male" id="male" />男
<input type="radio" name="gender" value="female" checked="checked" id="female" />女
<br /><br />
爱好
<input type="checkbox" name="hobby" value="zq" />足球
<input type="checkbox" name="hobby" value="lq" />篮球
<input type="checkbox" name="hobby" value="ymq" checked="checked" />羽毛球
<input type="checkbox" name="hobby" value="ppq" checked="checked"/>乒乓球
<br /><br />
你喜欢的明星
<select name="star">
<!-- 在下拉列表中使用option标签来创建一个一个列表项 -->
<option value="zbs" selected="selected">赵本山</option>
<option value="fbb">范冰冰</option>
<option value="lxr">林心如</option>
</select>
<br /><br /
自我介绍 <textarea name="info"></textarea>
<br /><br />
<input type="submit" value="注册" />
<input type="reset" />
<input type="button" value="按钮" />
<br /><br />
<button type="submit">提交</button>
<button type="reset">重置</button>
<button type="button">按钮</button>
</form>
</body>
</html>三、input属性补充
1: autocomplete="off" 关闭自动补全
2: readonly 设置为只读，不能修改
3: disabled 设置为禁用
4: autofocus 自动获取焦点
5: placeholder 提示内容
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<form action="./target.html">
<input type="text" name="username" placeholder="请输入姓名" />
<button type="submit">提交</button>
</form>
</body>
</html>
