HTML5中新元素、新属性汇总；HTML5中已经不支持元素（或改为css实现）等

一、新元素

1、新增的结构元素

figure元素

表示一段独立的流内容，一般表示文档主题流内容中的一个独立的单元。使用figcaption元素为figure元素组添加标题;

(figcaption也是新增的元素)

html5与html4代码比较：

<figure>

    <figcaption>共产党</figcaption>

    <p>共产党是中华人民共和国的第一大政党</p>

</figure>

<dl>

    <h1>共产党</h1>

    <p>共产党是中华人民共和国的第一大政党</p>

</dl>

2、新增的input元素的类型

大多都有，value、min、max、step属性

下面是示例：

输入您的 email 地址 : < input type= "email" name= "user_email" >< input type= "submit" value= " 提交 " >< br />

Password: < input type= "password" name= "pwd" maxlength= "8" >< br >

这是网页地址： < input type= "url" name= "user_url" >< input type= "submit" value= " 提交 " >< br />

有限制的数字范围（ 1—9 ）： < input type= "number" name= "user_number" min= "1" max= "9" step= "3" >< br />

滑动块： < input type= "range" name= "user_range" min= "0" max= "10" step= "2" >< br />

<!--date 相关的一些属性，部分浏览器不支持 -->

输入您的生日 : < input type= "date" name= "user_date" required= "required" >< input type= "submit" value= " 提交 " >< br />

3 、新增的其他元素

(1)video元素

定义视频，比如电影片段或其他视频流；等同于html4的object元素

(2)audio元素

定义音频，比如音乐或其他音频流；等同于html4的object元素

(3)embed元素

用插件在HTML中嵌入内容，用来插入各种多媒体，格式可以是Midi、Wav、AIFF、AU、MP3 ；  等同于html4的object元素

(4)mark元素

主要用来在视觉上向用户那些需要突出显示或者高亮显示的文字;mark元素的一个比较典型的应用就是在搜索结果中向用户高亮显示搜索关键词；等同于html4的span元素

(5)progress元素

表示运行中的进程，可以使用progress来显示 JavaScript 中消耗时间的函数的进程(图形表示)；html4中无法实现；

(6)meter元素

表示度量衡。仅用于已知最大值和最小值的度量。必须定义度量的范围，可以在元素的文本中。也可以在min/max属性中定义 html4无法实现；

(7)time元素

表示日期或者时间，也可以同时表示两者；等同于html4的span元素

(8)ruby元素

为使用非西方语言提供支持，表示注释。一般与rt、rp元素搭配使用；   

(9)rt元素

表示字符的解释或发音；  

(10)rp元素

在ruby注释中使用，以定义不支持ruby元素的浏览器所显示的内容；

(11)wbr元素

表示软换行。他与br元素的区别：br元素表示此处必须换行，而wbr元素的意思是浏览器窗口或父级元素的宽度够宽时。不进行换行，而当宽度不够时，主动在此处进行换行；

(12) canvas 元素

表示图形，比如图表和其他图像。这个元素本身没有行为，进提供一块画布，但它把一个绘图API展现给客户端javascript，以使脚本能够把想绘制的东西绘制到这块画布上；

(13)command元素

表示命令按钮，比如单选按钮，复选按钮或按钮；

(14)details元素

表示用户要求得到并且可以得到的细节信息。它可以与summary元素配合使用。summary元素提供标题或图例。标题是可见的，用户点击标题时，会显示出细节信息，summary元素应该details元素的第一个元素

(15)detalist元素

表示可选数据的列表，与input元素配合使用，可以制作出输入值的下拉列表；html5新增功能。

(16)datagrid元素

表示可选数据的列表，他以树形列表的形式来显示。

(17)keygen元素

表示生成密匙。   

(18)output元素

表示不同类型的输出，比如脚本的输出   

(19)source元素

为媒介元素定义媒介资源；对应html4的<param>

(20)menu元素

表示菜单列表。当希望列出表单空间时使用；

(21)del元素

表示从文档中的删除字

(22)Keygen元素

生成一对公钥和私钥

(23)source元素

表示媒体资源

(24)track元素

表示媒体的附加轨道（如字幕）

(25)hgroup元素

解决子标题排版的问题

(26)adress元素

与文章有关的联系信息

(27)details元素

展开以了解更多详情（默认没有展开，可以使用open属性改变默认设置）

(28)article元素

标签规定独立的自包含内容。

一篇文章应有其自身的意义，应该有可能独立于站点的其余部分对其进行分发

(29)placeholder元素

浏览器文本框中的提示信息

二、新属性

autocomplete ：下次填入时自动填充用户上次输入的内容

form:表单可以放在form外面，用id来实现连接

• 还有image型的input元素中新增的属性：如formaction、formencytpe、 formmethod、formtarget、formnovalidate

等价于button元素的同名属性

三、其他

1. data自定义属性

2. 全局属性：

属性	描述
accesskey	规定激活元素的快捷键。Windows下是Alt+一个字母按键
class	规定元素的一个或多个类名（引用样式表中的类）。
contenteditable	规定元素内容是否可编辑。                                             （新增）
contextmenu	上下文菜单在用户点击元素时显示。尚未被浏览器支持    （新增）
data-*	用于存储页面或应用程序的私有定制数据。                     （新增）
dir	规定元素中内容的文本方向。
draggable	规定元素是否可拖动。                                                   （新增）
dropzone	规定在拖动被拖动数据时是否进行复制、移动或链接。    （新增）
hidden	规定元素仍未或不再相关。                                             （新增）
id	规定元素的唯一 id。
lang	规定元素内容的语言。
spellcheck	规定是否对元素进行拼写和语法检查。                            （新增）
style	规定元素的行内 CSS 样式。
tabindex	规定元素的 tab 键次序。
title	规定有关元素的额外信息。
translate	规定是否应该翻译元素内容。                                          （新增）

3. 样式继承：

• 与元素外观相关的默认继承
• 与布局相关的默认不被继承
• 不被继承的可用inherit强制继承

4. http://lesscss.org(less改进css)

www.blueprint.org(css框架)

5. css中，人们默认1px约等于1in(英寸)的1/96（不是官方标准）

绝对单位：cm in mm pt pc（磅）

相对单位：em(与元素字号挂钩) rem(与HTML元素挂钩) ex(与元素高度挂钩)

6. 尽量使用符合要求的专用元素，避开使用有一点语义的呈现性元素（或者说有一点呈现的语义元素）

7. 使用什么元素要根据它们的含义而不是习惯样式来选择

8. <q>标签定义短的引用，内容会被“”修饰；

<blockquote> 标签定义块引用：浏览器在 blockquote 元素前后添加了换行，并增加了外边距。

9. form标签中的method元素中的get和post方法（配置http方法属性）

10. form标签中的name属性，不会提交给服务器，所以该属性作用仅限于DOM中；而input中如果不写name属性，那么用户在其中输入的信息就不会被传到服务器

11. 可以在form标签中定义id，这样别的地方的表格可以与其关联

12. SSL/HTTPS对浏览器和服务器之间的通信内容加密

13. input元素中的image生成图像按钮，服务器可以接受到用户点击的横纵坐标

14. 表单的三种编码方式：（未选择multipart/form-data，但是仍然可以发送文件？）

四、不再支持的元素

(1)能使用CSS替代的元素

1. 对于basefont、big、center、font、s、strike、tt、u这些元素；

由于他们的功能都是纯粹为画面展示服务的，而HTML5中提倡把画面展示性功能放在CSS样式表中统一编辑，所以将这些元素废除了，并使用编辑CSS、添加CSS样式表的方式进行替代。其中font元素允许由“所见即所得”的编辑器来插入，s元素、strike元素可以由del元素替代，tt元素可以由CSS的font-family属性替代。

2. 表格元素

• table元素中：sumary、align、width、bgcolor、cellpadding、cellspacing、frame、rules属性
• tr（行）元素中：align、char、charoff、valign、bgcolor
• td（列）元素中：scope属性已不再使用。abbr、axis、align、width、heigth、char、charoff、valign、bgcolor、nowrap

(2)框架标记

<frameset>	框架集
<frame>	框架
<iframe>	内联框架	仅仅支持 src 属性
<noframe>	无框架

(3)只有部分浏览器支持的元素

对于applet。bgsound、blink、marquee等元素，由于只有部分浏览器支持这些元素，特别是bgsound元素以及marquee元素，只被Internet Explorer所支持，所以在HTML5中被废除；其中applet元素可由embed元素或者object元素替代，bgsound元素可由audio元素替代，marquee可以由javascript编程的方式所替代。

(4)其他被废除的元素

1）超链接中的name，用id代替

2）h1 - h6 元素的 "align" 属性不被支持

3）废除dir元素，使用ul元素替代；

4）废除isindex元素，使用form元素与input元素相结合的方式替代；

5）废除listing元素，使用pre元素替代；

6）废除xmp元素，使用code元素替代；

7）废除nextid元素，使用GUIDS元素替代；

8）废除plaintext元素，使用"text/plian"MIME类型替代；

9）废除rb元素，使用ruby元素替代；

10）废除acronym元素，使用abbr元素替代；

11）

<isindex>

表明该文档是一个可用于检索的网关脚本

12）文字修饰标记

<big>	大字号
<small>	小字号
<u>	下划线
<s>	删除线
<strike>	删除线
<dir>	目录列表
<tt>	打字机文字
<blink>	闪烁文字(只适用Netscape浏览器)

13）图片标记<img>属性

border	边框
vspace	垂直间距
hspace	水平间距
align	排列