表单标签
* 可以提交数据到开心网的服务器，这个过程可以使用表单标签实现
* <form></form>:定义一个表单的范围
- 属性
** action：提交到地址，默认提交到当前的页面
** method：表单提交方式
- 常用的有两种 get 和 post,默认是get请求
** 面试题目：get 和 post区别
1.get请求地址栏会携带提交的数据，post不会携带（请求体里面。在第七天时候讲http协议时候）；
2.get请求安全级别较低，post较高；
3.get请求数据大小的限制，post没有限制。
** enctype:一盘请求下不需要这个属性，做文件上传时候需要
** 输入项：可以输入内容或者选择内容的部分
- 大部分的输入项 使用 <input type = "输入项的类型"/>
***** 在输入项里面需要一个name属性。
*** 普通输入项：<input type = "text"/>
*** 密码输入项：<input type = "password"/>
*** 单选输入项：<input type = "radio"/>
- 在里面需要属性 name
- name的属性值必须要相同
- 必须有一个value值
**** 实现默认选中属性
-- checked = "checked"
*** 复选输入项：<input type = "checkbox">
- 在里面需要属性 name
- name的属性值必须要相同
- 必须有一个value值
**** 实现默认选中属性
-- checked = "checked"
*** 文件输入项（在后面上传时候用到）
- <input type = "file"/>
*** 下拉输入项（不是在input标签里面的）
<select>
<option value = "1991">1991</option>
<option value = "1992">1992</option>
<option value = "1993">1993</option>
</select>
- 默认选择
*** selected = "selected"
*** 文本域
<textarea cols = "10" rows = "10"></textarea>
*** 隐藏项（不会显示在页面上，但是存在于html代码里面）
<input type = "hidden"/>
*** 提交按钮
<input type = "submit"/>
<input type = "submit"/ value = "注册">
file:///E:/JavaScript+html+Css_Practise/day01/code/10-表单标签1.html
?sex=on&love=on&birth=1992&tex=312&hid=
file:///E:/JavaScript+html+Css_Practise/day01/code/10-%E8%A1%A8%E5%8D%95%E6%A0%87%E7%AD%BE1.html
?phone=123344&pwd=1234&sex=nan&love=y&love=p&love=l&birth=&tex=123456&hid=
** ?输入项name的值 = 输入的值&
** 参数类似于key-value形式
*** 使用图片提交
<input type = "image" src = "图片路径"/>
*** 重置按钮
<input type = "reset "/>
*** 普通按钮（和明天讲JS在一起使用）
<input type = "button" value = ""/>
小项目实例1：
<!doctype html>
<html lang="en">
<head>
<title>表单标签1</title>
</head>
<body>
<form action = "hello.html" method = "get">
手机号码：<input type = "text" name = "phone"/><br/>
设置密码：<input type = "password" name = "pwd"/><br/>
性别：<input type = "radio" name = "sex" value = "nv" checked = "checked"/>女生
<input type = "radio" name = "sex" value = "nan"/>男生<br/>
爱好：<input type = "checkbox" name = "love" value = "y"/>羽毛球
<input type = "checkbox" name = "love" value = "p" checked = "checked"/>乒乓球
<input type = "checkbox" name = "love" value = "l"/>篮球<br/>
文件：<input type = "file"/><br/>
生日：<select name = "birth">
<option value = "">请选择</option>
<option value = "1991" selected = "selected">1991</option>
<option value = "1992">1992</option>
<option value = "1993">1993</option>
</select><br/>
自我描述：<textarea cols = "10" rows = "10" name = "tex"></textarea><br/>
隐藏项：<input type = "hidden" name = "hid"/><br/>
<input type = "submit" value = "注册"/>
<input type = "reset" value = "重置注册"/>
<input type = "button" value = "普通按钮"/>
<br/>
</form>
</body>
</html>
测试结果：
小项目实例2：
<!doctype html>
<html lang="en">
<title>案例</title>
</head>
<body>
<h1>免费开通人人网账号</h1>
<form action = "hello.html"><!--action：提交到地址，默认提交到当前的页面 与method:表单提交方式-->
<table width = "100%">
<tr>
<td align = "right">注册邮箱</td>
<td><input type = "text" name = "mail"></td>
</tr>
<tr>
<td> </td>
<td>你可以使用<a href = "#">账号</a>注册或者<a href = "#">手机号</a>注册</td>
</tr>
<tr>
<td align = "right">创建密码:</td>
<td><input type = "password" name = "pwd"></td>
</tr>
<tr>
<td align = "right">真实姓名:</td>
<td><input type = "text" name = "realname"></td>
</tr>
<tr>
<td align = "right">性别:</td>
<td><input type="radio" name = "sex" value = "nv">女生<input type="radio" name = "sex" value = "nan">男生</td>
</tr>
<tr>
<td align = "right">生日:</td>
<td>
<select name = "year">
<option value = "0001">1991</option>
<option value = "0002">2002</option>
<option value = "0003">2003</option>
<option value = "0004">2004</option>
</select>年
<select name = "month">
<option value = "1">1</option>
<option value = "2">2</option>
<option value = "3">3</option>
<option value = "4">4</option>
</select>月
<select name = "day">
<option value = "1">1</option>
<option value = "2">2</option>
<option value = "3">3</option>
<option value = "4">4</option>
</select>日
</td>
</tr>
<tr>
<td align = "right">我现在:</td>
<td>
<select name = "now">
<option value = "study">上学</option>
<option value = "work">工作</option>
</select>
</td>
</tr>
<tr>
<td> </td>
<td>
<img src = "01.PNG" width = "80" height = "40">
<a href = "#">看不清换一张?</a>
</td>
</tr>
<tr>
<td align = "right">验证码:</td>
<td><input type = "text" name = "yanzhengma"></td>
</tr>
<tr>
<td> </td>
<td><input type = "image" src = "02.PNG" width = "120" height = "40"/></td>
</tr>
</table>
</form>
</body>
</html>
运行结果展示；
