html学习之——html5新特性
一、html5增加的属性
1、表单属性
(1)placeholder
html5在input和textare标签中添加了placeholder属性,提示用户该输入什么,在数据框获得焦点后文字消失,提高了用户体验。
(2)autocomplete
html5在input和textare标签中添加了autocomplete属性,在用户完成一次输入后,下一次输入时有显示之前输入过的值。
(3)autofocus
autofocus属性一个网页中只能设置一个,设置多个时第一个生效。在进入页面时有autocomplete属性的控件将自动获得焦点。
(4)form
form属性可以是表单控件写在在表单外面,通过form属性明确该控件属于哪个表单。一个控件可以属于多个表单,通过form的id来确定。
(5)required
当提交表单时,设置有required属性的控件如果值为空,则检验不通过,不能提交。
(6)max min step
在日期,数字,时间控件里,设置max可以限制输入的最大值,min可以设置输入的最小是,step表示步长,比如min=1,step=2,max=7,则值应该是1,3,5,7,9
(7)list
在input标签中,可以使用list属性添加输入时的下拉菜单,有点类似于select,但list比select方便,他不仅可以选择下拉的选项,还可以自己输入。list属性的取值为相应的datalist的id,在datalist里增加autocomplete属性,可以让输入框的下拉菜单不仅显示自己设置的列表项,还可以显示之前输入过得值。使用户体验更好。
(8)表单重置属性 formaction,formmethod,formnovalidate,formtarget, formenctype
以前不使用js时,一个表单只能有一个提交的action和method,现在可以通过formaction实现不同的提交按钮提交到不同的action,通过ormmethod用不同的方法提交。
通过formtarget提交到不同的窗口,通过formnovalidate来确定提交时是进行验证还是不验证。
(8)image的width,height
在input的type为image时,可以通过width和height设置image的宽高。
(9) pattern
pattern属性的值为正则表达式,可以通过正则表达式验证输入框中的内容是否匹配,并给出出相应的提示
(10)multiple
multiple属性可以规定输入域可以同时选择输入多个元素
(11)fileset的disabled
fileset的disabled可以把他的子元素全部设置为disabled,但是不会影响 legend中的元素
(12)selectionDirection
在input或者textare中如果正向选中文字,则selectionDirection的值为forword,如果是反向选中,则为backword
(13)label的control
可以通过label的control属性获取到包含在label里面的控件。
此外html5在表单方面还扩大了input控件中type属性的值,增加了url,time,datapicker,email,phone等值并会自动校验。
2、链接属性
(1)media
a标签中添加了media属性,media属性只能在有href属性存在时才可以使用,规定该链接是为哪种设备优化。
(2)hreflang
同样hreflang属性也是在href存在的时候才有,规定与链接相关联的文档使用的语言
(3)rel
在a标签中,rel属性表示被链接文档和当前文档之间的关系。
(4)sizes
link标签增加了sizes属性,规定被链接的资源的大小
(5)target
base标签中增加了target属性,规定打开链接的窗口位置。
3、其他属性
(1)meta的chartset属性
(2)ol的reserved属性
如果是正序排列,则reserved的值为true,倒序为false
(3)style的scoped属性
style的scoped属性使得style样式只能由于规定的某一部分html代码
(4)script的async
script的async使得脚本文件异步加载执行
(5)menu的type,label属性
二、html5增加的标签
1、canvas新元素
<canvas></canvas>:标签定义图形,比如图表和其他图像。该标签基于 JavaScript 的绘图 API
2、多媒体元素
(1)<video>:定义音频文件
(2)<audio>:定义视频文件
(3)<souce>:定义多媒体资源
(4)<embed>:定义插入的内容,如插件
(5)<track>:为多媒体文件定义外部文件轨道
3、表单元素
(1)datalist:定义选项列表
(2)Keygen:表单的密钥生成器字段
(3)output:定义不同类型的输出,如脚本的输出
4、语义和结构元素
参见一下链接:
http://www.cnblogs.com/qiaoyun/p/7506647.html
三、html5废除的标签
- <acronym>
- <applet>
- <basefont>
- <big>
- <center>
- <dir>
- <font>
- <frame>
- <frameset>
- <noframes>
- <strike>
- <tt>
四、html5增加的其他功能特性
此外,HTML5还增加了本地存储localstorage,在浏览器关闭后数据不会删除,sessionstorage在浏览器关闭后自动删除。地理位置服务 Geolocaltion,websocket,webwork