Day03
2017-01-22 14:23:09 0 举报
AI智能生成
清晨的阳光透过窗户,洒在床头的闹钟上,它的指针刚好指向6点。这是新的一天的开始,也是Day03的开始。我慵懒地伸了个懒腰,感受着身体的酸痛和疲惫。昨晚的工作让我几乎没有休息的时间,但我知道我必须坚持下去。我走到窗前,看着窗外的世界,一片宁静。这是我最喜欢的时刻,一切都还没有开始,一切都有可能。我深吸一口气,然后开始了新的一天。早餐是简单的面包和咖啡,但对我来说,这就足够了。我收拾好自己,走出家门,迎接新的挑战。这就是Day03,充满了挑战和希望的一天。
作者其他创作
大纲/内容
表单
表单概述
表单的作用
用于显示、收集信息,并提交信息到服务器
两个基本部分
实现数据交互的可视化界面元素(前端)
<form></form>
表单控件元素
提交后的表单处理(服务器端)
表单元素(form)
作用
收集用户信息并提交给服务器
里面包含与用户交互的表单控件元素
注意:表单元素在页面是不可见的,但不能省略
语法
标记
<form></form>
属性
action
作用
定义表单被提交时发生的动作,即要提交的服务器地址
取值
服务器端的处理程序地址,如*.jsp,*.php,*.do等
需要与服务器端开发人员沟通
默认提交给本页
method
作用
表单数据提交的方式
取值
get
明文提交,提交的数据是可以显示在地址栏上的
安全性较低
大小限制为2KB
post
隐式提交,所提交的数据是不显示在网页上的
安全性较高
无大小限制
……
enctype
作用:指定表单数据的编码方式
取值
application/x-www-form-urlencoded(默认值)
multipart/form-data
仅在文件提交时使用
text/plain
<input>元素
用户收集用户信息并提供不同的输入字段
语法
标记
<input>
主要属性
type
根据不同的type属性值可以创建各种类型的输入字段
默认值:text
value
最终提交给服务器的值
name
控件的名称,提供给服务器使用
注意:如果不设置name属性的话,那么控件则无法提交
disabled
禁用控件,该属性没有值
表现形式
文本框与密码框
标记
文本框
<input type="text">
密码框
<input type="password">
属性
name
名称
value
提交给服务器的值,可以是用户输入的数据
maxlength
限制输入的字符数
readonly
设置文本控件只读
单选按钮和复选框
标记
单选按钮
<input type="radio">
复选框
<input type="checkbox">
属性
name
设置名称,并用于分组,一组单选按钮或复选框我名称必须相同
单选按钮:一组中只能有一个被选中
复选框:服务器端,可以通过一个名字获取所有选中的值
value
控件的值
checked
设置默认被选中
按钮
标记
提交按钮
<input type="submit">
功能:提交表单数据
重置按钮
<input type="reset">
功能:将表单恢复到初始化状态
普通按钮
<input type="button">
属性
name
value
按钮上的文本
隐藏域和文件选择框
标记
隐藏域
<input type="hidden">
文件选择框
<input type="file">
属性
隐藏域
name
value
文件选择框
name
注意
文件选择框
form的method必须为post
form的enctype必须为multipart/form-data
textarea 元素
标记
<textarea></textarea>
属性
name
名称
cols
指定文本区域的列数
变相指定宽度
rows
指定文本区域的行数
变相指定高度
readonly
只读
select 和 option 元素
选项框
标记
<select></select>
属性
name
名称
size
默认显示的选项数量,大于1,则为滚动列表
multiple
设置多选,该属性没有值
选项
标记
<option></option>
属性
value
选项的值
selected
预选中
其他元素
label元素
作用
关联文本与表单控件
关联后,点击文本如同点击表单控件
语法
标记
<label>文本</label>
属性
for
与该元素相联系的控件ID值
fieldset
作用
为控件分组
标记
<fieldset></fieldset>
<legend></legend>
结构标记
作用
HTML5所提供的结构标记,专门用于表示常见的网页结构(即布局)
常见结构标记
header元素
作用
用于定义文档的页眉即页面顶部信息
在页面上允许出现多次,可以作为任何部分的头部定义
标记
<header></header>
nav元素
作用
用来定义页面的导航链接部分
标记
<nav></nav>
section元素
作用
用于定义文档中的节,也可以表示文档中的一个具体的部分即主体内容
标记
<section></section>
article元素
作用
用于定义独立于文档的其他部分内容
如:论坛中的帖子,报纸的文章,博客条目或微博信息等
标记
<article></article>
footer元素
作用
用于定义某区域的脚注信息
一般靠近于某区域底部或页面底部内容
标记
<footer></footer>
aside
作用
定义页面的额外组成部分
一般多用于侧边栏和相关引用信息等
标记
<aside></aside>
其他常用标记
浮动框架
作用
可以在一个浏览器窗口中同时显示多个页面文档
语法
标记
<iframe>内容</iframe>
注意
内容 ,可以为普通的文本描述,当浏览器不支持<iframe>元素时,将显示该文本描述信息
属性
src
浮动框架中的网页URL
width
宽度
height
高度
frameborder
浮动框架边框
摘要与细节
作用
允许将网页上的部分信息进行展开或收缩
标记
<details></details>
<summary></summary>
必须包含在<details>中
要作为<details>元素的第一个子元素
度量元素
作用
用于在网页定义一个度量衡
常用语静态比例的显示
语法
<meter>文本</meter>
属性
min
度量范围的最小值,默认为0
max
度量范围的最大值,默认为1
value
度量值,默认为0
时间元素
作用
用来定义公历的时间或日期
可以表示时间的不同表现形式
语法
标记
<time>文本</time>
属性
datetime
规定日期/时间,日期与时间之间用"T"分隔
高亮文本显示
作用
定义页面中带有记号的文本
多数用于要突出显示的文本
被设置为高亮显示的文本会显示额外的背景色
语法
标记
<mark>文本</mark>
0 条评论
下一页