现代的阅读器都支持HTML5。另外，所有阅读器，包括旧的和最新的，对没法辨认的元素会作为内联元素自动处理。正由于如此，你可以 "教会" 阅读器处理 "未知" 的 HTML 元素。乃至你可以教会 ie6 (windows XP 2001) 阅读器处理未知的 HTML 元素（即让1些较早的阅读器（不支持HTML5）支持 HTML5）。
1、将 HTML5 元素定义为块元素
HTML5 定了8个新的HTML 语义（semantic） 元素。所有这些元素都是块级元素。为了能让旧版本的阅读器正确显示这些元素，你可以设置 CSS 的 display 属性值为 block：
header,section,footer,asIDe,nav,main,article,figure { display: block; }你可以为 HTML 添加新的元素。该实例向 HTML 添加的新的元素，并为该元素定义样式，元素名为 <myHero> ：
<!DOCTYPE HTML><HTML><head lang="en"> <Meta charset="UTF⑻"> <Title>Creating an HTML Element</Title> <script>document.createElement("myHero")</script> <style> myHero { display: block; background-color: #ddd; padding: 50px; Font-size: 30px; } </style></head><body> <h1>我的第1个标题</h1> <p>我的第1个段落。</p> <myHero>我的第1个新元素</myHero></body></HTML>运行结果：
注：JavaScript 语句 document.createElement("myHero") 是为了为 IE 阅读器添加新的元素。
3、Internet Explorer阅读器问题你可使用以上的方法来为 IE阅读器添加 HTML5 元素，但是：Internet Explorer 8及更早 IE版本的阅读器不支持以上的方式。荣幸的是， Sjoerd Visscher创建了 "HTML5 Enabling JavaScript"," shiv":
<!--[if lt IE 9]> <script src="http://HTML5shiv.Googlecode.com/svn/trunk/HTML5.Js"></script><![endif]-->
以上代码是1个注释，作用是在 IE 阅读器的版本小于 IE9 时将读取 HTML5.Js 文件，并解析它。
注意：国内用户请使用百度静态资源库（Google 资源库在国内不稳定）：
<!--[if lt IE 9]> <script src="http://apps.bdimg.com/libs/HTML5shiv/3.7/HTML5shiv.min.Js"></script><![endif]-->针对IE阅读器HTML5shiv 是比较好的解决方案。HTML5shiv主要解决HTML5提出的新的元素不被ie6⑻辨认，这些新元素不能作为父节点包裹子元素，并且不能利用CSS样式。
4、完善的 Shiv解决方案<!DOCTYPE HTML><HTML><head> <Meta charset="UTF⑻"> <Title>Styling HTML5</Title> <!--[if lt IE 9]> <script src="http://apps.bdimg.com/libs/HTML5shiv/3.7/HTML5shiv.min.Js"> </script> <![endif]--></head><body><h1>我的第1篇文章</h1><article> London is the cAPItal city of England. It is the most populous city in the United Kingdom,with a metropolitan area of over 13 million inhabitants.</article></body></HTML>
运行结果：
注：HTML5shiv.Js 援用代码必须放在 <head> 元素中，由于 IE 阅读器在解析 HTML5 新元素时需要先加载该文件。
5、HTML5新元素
自1999年以后HTML 4.01 已改变了很多,今天，在HTML 4.01中的几个已被废弃，这些元素在HTML5中已被删除或重新定义。
为了更好地处理今天的互联网利用，HTML5添加了很多新元素及功能，比如:图形的绘制，多媒体内容，更好的页面结构，更好的情势处理，和几个API拖放元素，定位，包括网页利用程序缓存，存储，网络工作者等。
6、<canvas> 新元素
标签 | 描写 |
<canvas> | 标签定义图形，比如图表和其他图象。该标签基于 JavaScript 的绘图 API |
7、新多媒体元素
标签 | 描写 |
<audio> | 定义音频内容 |
<vIDeo> | 定义视频（vIDeo 或 movIE） |
<source> | 定义多媒体资源 <vIDeo> 和 <audio> |
<embed> | 定义嵌入的内容，比如插件。 |
<track> | 为诸如 <vIDeo> 和 <audio> 元素之类的媒介规定外部文本轨道。 |
8、新表单元素
标签 | 描写 |
<dataList> | 定义选项列表。请与 input 元素配合使用该元素，来定义 input 可能的值。 |
<keygen> | 规定用于表单的密钥对生成器字段。 |
<output> | 定义不同类型的输出，比如脚本的输出。 |
9、新的语义和结构元素
HTML5提供了新的元夙来创建更好的页面结构：
标签 | 描写 |
<article> | 定义页面的侧边栏内容 |
<asIDe> | 定义页面内容以外的内容。 |
<bdi> | 允许您设置1段文本，使其脱离其父元素的文本方向设置。 |
<command> | 定义命令按钮，比如单选按钮、复选框或按钮 |
<details> | 用于描写文档或文档某个部份的细节 |
<dialog> | 定义对话框，比如提示框 |
<summary> | 标签包括 details 元素的标题 |
<figure> | 规定独立的流内容（图象、图表、照片、代码等等）。 |
<figcaption> | 定义 <figure> 元素的标题 |
<footer> | 定义 section 或 document 的页脚。 |
<header> | 定义了文档的头部区域 |
<mark> | 定义带有记号的文本。 |
<meter> | 定义度量衡。仅用于已知最大和最小值的度量。 |
<nav> | 定义运行中的进度（进程）。 |
<progress> | 定义任何类型的任务的进度。 |
<ruby> | 定义 ruby 注释（中文注音或字符）。 |
<rt> | 定义字符（中文注音或字符）的解释或发音。 |
<rp> | 在 ruby 注释中使用，定义不支持 ruby 元素的阅读器所显示的内容。 |
<section> | 定义文档中的节（section、区段）。 |
<time> | 定义日期或时间。 |
<wbr> | 规定在文本中的何处合适添加换行符。 |
10、已移除的元素
以下的 HTML 4.01 元素在HTML5中已被删除:
<acronym> <applet> <baseFont> <big> <center> <dir> <Font> <frame> <frameset> <noframes> <strike> <tt>以上是内存溢出为你收集整理的HTML5之浏览器支持、新元素全部内容，希望文章能够帮你解决HTML5之浏览器支持、新元素所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）