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

原文地址:https://www.cnblogs.com/qiaoyun/p/7510204.html