form表单

一、定义:

在web网页中用来给访问者填写信息,从而能采集客户端信息,是网页具有交互的功能。

二、原理:

一般是将表单设计在一个html 文档中,当用户填写完信息后做提交(submit)操作,于是表单的内容就从客户端的浏览器传送到服务器上,经过服务器上的 ASP 或 PHP 等处理程序处理后,再将用户所需信息传送回客户端的浏览器上,这样网页就具有了交互性。

三、实例:

如登录注册、搜索框等

四、组成:

表单是由窗体和控件组成的,一个表单一般应该包含用户填写信息的输入框,提交按钮等,这些输入框,按钮叫做控件,表单很像容器,它能够容纳各种各样的控件。

五、标签:

内容

*注意:表单之间不能相互嵌套,一个页面可以有多个表单;表格之间可以相互嵌套

六、数据提交的方式——get和post:

1.get提交数据不安全,会在地址栏中显示;post安全
2.get只能提交少量的数据(不能大于2kb);post理论上没有限制
*默认提交方式:get

七、表单元素:

1.基本表单元素:

单行文本框:
密码框:
单选按钮:
多选按钮:
提交按钮: 
重置按钮: 
没有功能的按钮:
提交按钮:
重置按钮:
没有功能的按钮:

*实例:

姓名:
密码:
性别:
爱好:唱歌 跳舞 运动 吃饭

form表单_第1张图片

2.其他表单元素:

文件:
* 把form的编码格式改为二进制:enctype="multipart/form-data"
隐藏域:
*不是给用户看,但隐藏域携带的信息可以正常的提交
图片提交按钮:
下拉列表:

下拉列表分组:

多行文本框:

提升用户体验度:

*配合单选和多选按钮使用,for属性和input属性一致

*实例:

文件:

隐藏域:

图片提交按钮:

城市:

多行文本框:

form表单_第2张图片
form表单_第3张图片
form表单_第4张图片

八、表单元素的属性:

type——类型
name——名称
value——当前值
checked——默认被选中,配合单选按钮和多选按钮使用
selected——默认显示,配合option使用
readonly——只读
disable——禁用

你可能感兴趣的:(第一部分,HTML+CSS,html)