h5newfun

HTML5的新增功能

1、HTML5增加、修改或删除的元素

1)简化的文件类型定义:从前网页设计人员在进行文件类型定义(DTD,)时,必须编写一长串的网址和版本。

1
<!doctype html>

2)简化的字符集指定方式:从前网页设计人员在制定字符集时,必须写异常穿的属性。

1
<meta charset="utf-8">

3)新增元素:HTML5增加了一些新的元素

1
2
3
4
5
6
7
8
与文件结构相关的元素 说明
<section> 标记通用的区段
<article> 标记独立的内容
<aside> 标记侧边栏
<nav> 标记导航栏
<header> 标记区段的页首
<footer> 标记区段的页尾
<hgroup> 标记多个标题的组合
1
2
3
4
5
6
7
8
用来嵌入外部内容的元素 说明
<video> 播放视频
<audio> 播放音频
<source> 制定视频或音频资源的连接与类型
<embed> 嵌入插件
<figure> 标注图片、表格、程序代码等能够从主要内容抽离区块
<figcaption> 针对<figure>元素的内容制定区块
<canvas> 在网页上建立一个绘图区,供绘制图形、绘制文字、填入颜 色、渐层或设计动画

注意:< video>和< audio>赋予浏览器原生能力来播放视频与音频,这样浏览器将不再需要因爱Apple QuickTime、Adobe Flash、RealPlayer等插件,也不洗担心用户可能没有安装插件导致看不到或听不到网页上的视频与音频。

1
2
3
4
5
6
7
8
9
10
11
12
13
与窗体相关的元素 说明
<progress> 进度表
<keygen> 产生公钥
<output> 产生输出用的窗体
<meter> 计量或分数值,例如得票率、使用率
<time> 标记日期时间
<menu> 菜单
<command> 菜单中的指令
<datalist> 数据清单
<details> 详细信息
<summary> 摘要
<ruby>、<rt>、<rp> 注音或拼音
<mark> 荧光标记

4)修改的元素:HTML5修改了一些现有的元素,例如< em>,< i>,< strong>,< b>,< address>,< ol>等

5)删除的元素:html删除了一些现有的元素,

1
2
删除的元素 说明
<frame>,<frameset>,<nofranes> 改用<iframe>与css
1
2
3
<font>,<basefont>,<big>,<blink>, 改用css
<center>,<strike>,<tr>,<nobr>,
<spacer>,<marquee>
1
2
3
4
5
6
7
8
<bgsound> 改用<audio>
<noembed> 改用<object>
<acronym> 改用<abbr>
<applet> 改用<embed>或<object>
<dir> 改用<ul>
<plaintext> 改用<pre>
<listing>,<xmp> 改用<pre>或<code>
<rb> 改用<ruby>

6)新增的全局属性:HTML5增加了一些新的全局属性,可以套用到多数的HTML元素。

1
2
3
4
5
6
7
8
9
新增的全局属性 说明
contenteditable 制定元素的内容能否被编辑
contextmenu 指定元素的快捷菜单
draggable 指定元素能否进行拖放操作
dropzone 将元素指定为拖放操作的放置目标
hidden 指定元素的内容是否被隐藏起来
spellcheck 指定是否检查元素的拼写与文法
role、aria-* 这些属性和HTML5导入WAI-ARIA规格有关,目的是提 升网页的无障碍性
data-* 通过自定义属性将信息传送给Script