html入门3_表单和框架

1.单词：

Form 表单   select 选择   Frame 框架   Reset 重置   
Button 按钮   textarea 文本域   Text 文本   Submit 提交
Checkbox 复选框   radio 单选框   frameset 框架集    

2.请求，参数，列表

input标签:type="各种值"，text 文本的意思
form中的标签的name属性用于 提交 参数列表的 参数名

例：
url:https://www.baidu.com/s?wd=%E8%8B%B1%E9%9B%84%E8%81%94%E7%9B%9F
https://www.baidu.com/s  ？前面的叫请求
wd=%E8%8B%B1%E9.....	 ？后面的 参数名1=参数值1&参数名2=参数值2  整体叫做参数列表

表单 action  https：//www.baidu.com/s
"?wd=" + "输入的内容"
		
输入项（标签）的name属性的值wd、name和参数列表的参数名有关系
<input type = "text" name="wd"/>
可提交的按钮
<input type = "submit" value = "提交"/>

3.Form表单

form 表单， 无样式的，仅用于标记表单
action属性:请求地址，提交到xx位置
method属性:GET/Post  （get：明文  post：数据流）
默认是get:url上体现参数列表。
post:url不体现参数列表，以数据流形式发送。更安全，例如登录密码或文件上传

4.表单中的元素

4.1 submit

input:
type = "submit":提交按钮
value:按钮上的值

4.2 文本输入框

type = "text" 默认的就是text
value:输入框的值
size：输入框显示的字符数，不准
maxlength：最大输入字符数
placeholder：默认显示的无效提示文字

required：H5 特殊属性 必须输入验证
novalidate="novalidate" form关闭H5自带验证功能

4.3 密码输入框，属性同上

4.4 H5的文本框：

type=number; min max step
type=range;	横条拉动
type=email;	邮箱
type=url;	网址
type=color;	颜色选择框
type=date;	日期
type=time;	时间
type=tle;	电话号码

4.5 radio:单选按钮（重点，常用）

name属性用于将几个单选按钮标记为一组，从而只能从中选择一个
value属性用于 提交时确定哪一个被选中
checked：特殊属性，默认被选中

五个特殊属性，有属性就生效，不必要给值
checked，selected，disabled，readonly，required

4.6 复选框：checkbox

复选按钮：多选按钮
提交时：一般用name区分一组，用value区分选中
checked特殊属性，默认被选中

4.7 重置按钮：reset

重置按钮，使页面回到页面初始状态，不是清空	

4.8 file用于文件上传

4.9 button

在表单中的按钮：

1.提交按钮
	1.input type=submit
	2<button>提交</button>
2.重置
	1.type=reset
3.普通按钮
	1.type="button" value="不提交的按钮"
4.可提交的图片
	1.type="image" src=""

4.10 hidden

看不见的可提交标签

4.11 多行文本输入框：textarea

属性：

rows:行数
cols:列数

textarea的值就是 内容。要注意开始和结束标签不要有空格和空行

4.12 下拉列表select > option

提交时：

select 上写name
option 上写value

option上的
selected 默认被选中

lable：等同于 optional标签的内容

4.13 特殊属性：disabled/readonly

checked:  redio，checkbox 能用
selected: select的option 能用
disabled:  灰的 不能提交，通常用type="hidden"解决提交问题
readonly:  可以提交

5.框架集 frameset >frame

！！！frameset是不需要body的！！！

！！！html4的头也要是frameset的头！！！

frameset属性： src关联的文件

1.rows=" , , , "  上下分
	1.rows="100px,*"
	2.rows="10%,*"
2.cols=" , , ,"（同上） 左右分
！！！分的是frame框架。frameset也能嵌套frameset！！！
3.点击某个frame中的链接控制 哪个部分跳转？？
	a标签的target：
		1._parent/_top:都是整个网页跳转
		2.某个frame的name。则name所指的frame跳转

6.内联框架 iframe

a标签的target:

_parent:内联的所在框架内全变
_top:直接整个网页都变