form表单
1 什么是表单
就是从浏览器向服务器传输数据的手段(用于显示、收集信息，并且提交信息到服务器)
2 表单二要素
2.1 form元素：就是有内容和属性的form标签
2.2 表单控件： 就是可以放到表单域里面的控件（就是信息输入项）
3 补充之标签和元素的区别
3.1 标签
标签就是<head>、<body>、<table>等被尖括号“<”和“>”包起来的对象，绝大部分的标签都是成对出现的，如<table></talbe>、<form></form>。当然还有少部分不是成对出现的，如<br>、<hr>等。 (标签就是没有属性和内容的元素)
3.2 元素
元素由一个开始的标签和结束的标签组成并且包含内容、拥有属性(故：元素就是拥有属性和内容的标签)
HTML网页实际上就是由许许多多各种各样的HTML元素构成的文本文件，并且任何网页浏览器都可以直接运行HTML文件。所以可以这样说，HTML元素就是构成HTML文件的基本对象，HTML元素可以说是一个统称而已。HTML元素就是通过使用HTML标签进行定义的。
4 表单元素
4.1 表单定义
使用<form></form>标记；<form>和</form>之间的区域叫做表单域，所有的表单控件都要写在表单域中；表单域中的数据就是要传输给服务器的数据
4.2 表单主要属性
4.2.1 action -->> 提交表单的URL
4.2.2 method -->> 提交数据的方式
4.2.3 enctype -->> 数据进行编码的方式
5 表单控件
5.1 input元素
不同的type类型代表不同外观的input元素：
text：文本框 password：密码框
radio : 单选框 checkbox : 复选框
submit : 提交按钮(提交表单数据给服务端或者其他程序)
reset : 重置按钮(清空表单内容并且恢复到默认值)
button ： 普通按钮(用于执行客户端脚本)
hidden ： 隐藏域(用于书写在表单中不让用户看见的信息)
file : 文件选择框(选择要上传的文件)
5.1.1 文本框、密码框
5.1.1.1 属性
value ： 访问者输入的任何文本
maxlength : 限制输入的字符数量
readonly : 将文本控件设置为只读
5.1.2 单选框、复选框
5.1.2.1 属性
value ： 程序员设定的文本值；当提交form时，被选中的控件的value值就会被提交到服务器
name : 用于实现分组，同一组的单选框必须相同；分组后每一组只有一个元素能够被选中（例子：性别的选择）
利用name的值相同来实现单选只能适用于单选框；对于复选框而言name值是否相同都都可以实现多选
checked : 将表单控件设置成被选中
5.1.3 提交按钮、重置按钮、普通按钮
5.1.3.1 属性
value : 按钮的名字(value属性的默认值是“提交”)
5.1.4 隐藏域、文件选择框
5.2 label元素
用于给控件设置显示名称
5.2.1 语法
<label for="控件id">文本</label>
注意：这里的文本可以是图片、视频......
5.2.2 属性
for ： 设置文本所关联的控件id，关联后点击label元素就相当于点击了关联的控件
5.3 textarea元素(文本域元素)
5.3.1 语法
<textarea name="" id="" cols="30" rows="10"></textarea>
5.3.2 属性
cols : 指定列数
rows : 指定行数
readonly : 设定为只读
5.4 select元素(下拉选择内容元素)
5.4.1 语法
1 <select name="选择" id=""> 2 <option value="1">java</option> 3 <option value="2">python</option> 4 <option value="3">c++</option> 5 </select>
5.5 提交的注意事项
5.5.1 任何表单控件都有的属性： id name value
5.5.1 只有书写了name属性的表单控件才可以进行提交，而且提交的内容就是value的属性值(可以不书写value属性，但是每个表单控件都会被自动添加上value属性，而且value属性的属性是动态变化的，所以在进行提交的时候是提交的最新的value属性值)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset = "utf-8" /> 5 <meta name="Keywords" content="" /> 6 <mata name = "description" content = "" /> 7 <title>单项测试</title> 8 <link rel="stylesheet" href="test.css"> 9 <form action=""> 10 账号：<input value="zhanghao" name='user' type="text" placeholder="请输入账号" /> 11 <br /> 12 <br /> 13 密码：<input name='password' type="password" placeholder="请输入密码"> 14 <br /> 15 <br /> 16 17 性别： 18 <input type="radio" name="gender" />男 19 <input type="radio" name="gender" />女 20 <input type="radio" name="gender" />不告诉你 21 <br /> 22 <br /> 23 24 爱好: 25 <input id="basketball" name="'habbit'" type="checkbox"><label for="basketball"><img src="../img/123.jpg" alt=""></label> 26 足球<input name="'habbit'" type="checkbox"> 27 排球<input name="'habbit'" type="checkbox"> 28 <br /> 29 <br /> 30 31 <textarea readonly="readonly" name="" id="" cols="30" rows="10">nihao</textarea> 32 <br /> 33 <br /> 34 35 <input type="hidden" value="hello" name="hidden" checked="checked" /> 36 <br /> 37 <br /> 38 39 <input type="file" name="file" /> 40 <br /> 41 <br /> 42 43 <select name="选择" id=""> 44 <option value="1">java</option> 45 <option value="2">python</option> 46 <option value="3">c++</option> 47 </select> 48 <br /> 49 <br /> 50 51 <input type="submit" value="点击提交" name="tj" /> 52 <br /> 53 <br /> 54 55 <input type="reset" value="点击重置" name='cz'/> 56 </form> 57 <form action=""></form> 58 </head> 59 <body> 60 <p>测试</p> 61 </body> 62 </html>
