每一章中的 HTML5 示例

  实例

  Your browser does not support the video tag.

  亲自试一试点击“亲自试一试”来查看该例如何运行。什么是 HTML5?

  HTML5 是最新的 HTML 标准。

  HTML5 是专门为承载丰富的 web 内容而设计的,并且无需额外插件。

  HTML5 拥有新的语义、图形以及多媒体元素。

  HTML5 提供的新元素和新的 API 简化了 web 应用程序的搭建。

  HTML5 是跨平台的,被设计为在不同类型的硬件(PC、平板、手机、电视机等等)之上运行。

  注释:在下面的章节中,您将学到如何“帮助”老版本的浏览器处理 HTML5。HTML5 中的新内容?

  HTML5 的新的文档类型(DOCTYPE)声明非常简单:

  The new character encoding (charset) declaration is also very simple:

  HTML5 实例:

  Content of the document......

  注释:HTML5 中默认的字符编码是 UTF-8。HTML5 - 新的属性语法

  HTML5 标准允许 4 中不同的属性语法。

  本例演示在 标签中使用的不同语法:

  类型示例

  Empty

  Unquoted

  Double-quoted

  Single-quoted

  在 HTML5 标准中,根据对属性的需求,可能会用到所有 4 种语法。HTML5 - 新特性

  HTML5 的一些最有趣的新特性:

  新的语义元素,比如 , , , and 。

  新的表单控件,比如数字、日期、时间、日历和滑块。

  强大的图像支持(借由 和 )

  强大的多媒体支持(借由 和 )

  强大的新 API,比如用本地存储取代 cookie。

  HTML5 - 被删元素

  以下 HTML 4.01 元素已从 HTML5 中删除:

  您可以帮助老版本浏览器处理 HTML5。HTML5 浏览器支持

  所有现代浏览器都支持 HTML5。

  此外,所有浏览器,不论新旧,都会自动把未识别元素当做行内元素来处理。

  正因如此,您可以帮助老式浏览器处理”未知的“ HTML 元素。

  注释:您甚至可以教授石器时代的 IE6 如何处理未知的 HTML 元素。把 HTML5 元素定义为块级元素

  HTML5 定义了八个新的语义 HTML 元素。所有都是块级元素。

  您可以把 CSS display 属性设置为 block,以确保老式浏览器中正确的行为:

  实例

  header, section, footer, aside, nav, main, article, figure {

  display: block;

  }

  向 HTML 添加新元素

  您可以通过浏览器 trick 向 HTML 添加任何新元素:

  本例向 HTML 添加了一个名为 的新元素,并为其定义 display 样式:

  实例

  My First Heading

  My first paragraph.

  My First Hero

  亲自试一试已添加的 JavaScript 语句 document.createElement("myHero"),仅适用于 IE。Internet Explorer 的问题

  上述方案可用于所有新的 HTML5 元素,但是:

  注意:Internet Explorer 8 以及更早的版本,不允许对未知元素添加样式。

  幸运的是,Sjoerd Visscher 创造了 "HTML5 Enabling JavaScript", "the shiv":

  以上代码是一段注释,但是 IE9 的早期版本会读取它(并理解它)。完整的 Shiv 解决方案

  实例

  My First 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.

  亲自试一试引用 shiv 代码的链接必须位于 元素中,因为 Internet Explorer 需要在读取之前认识所有新元素。HTML5 Skeleton

  实例

  HTML5 SKeleton

  HTML5 Semantic

  HTML5 Geolocation

  HTML5 Graphics

  Famous Cities

  London

  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.

  Paris

  Paris is the capital and most populous city of France.

  Tokyo

  Tokyo is the capital of Japan, the center of the Greater Tokyo Area,

  and the most populous metropolitan area in the world.

  © 2014 W3Schools. All rights reserved.