2.2 HTML5新增內容

自從2010年HTML5正式推出，就以一種驚人的速度被迅速地推廣，世界各知名瀏覽器廠商也對HTML5有很好的支持。例如，微軟就對下一代IE 9做了標準上的改進，使其能夠支持HTML5。而且HTML5還有一個特點就是在老版本的瀏覽器上也可以正常運行。本節將為大家介紹與HTML4相比HTML5新增的元素與屬性。

2.2.1 新增的元素

在HTML5中，新增了以下元素。

<section>元素

<section>元素表示頁面中的一個區域，例如章節、頁眉、頁腳或頁面中的其他部分。可以與h1、h2、h3、h4等元素結合起來使用，標示文檔結構。

【例2.12】 應用<section>標記在頁面中定義一個區域。

上面這段代碼相當于在HTML4中使用<div>標記在頁面中定義一個區域。

<article>元素

<article>元素表示頁面中的一塊與上下文不相關的獨立內容，例如博客中的一篇文章、一段用戶評論等。除了內容部分，一個<article>元素通常有自己的標題、腳注等內容。

【例2.13】 應用<article>元素在頁面中定義一個區域。

<header>元素

<header>元素表示頁面中一個內容區域或整個頁面的標題。在例2.13中就為大家演示了<header>元素的應用。

<footer>元素

<footer>元素表示整個頁面或頁面中一個內容區域塊的腳注。例如日期、作者信息等，在例2.13中就為大家演示了<footer>元素的應用。

<aside>元素

<aside>元素用來表示當前頁面或文章的附屬信息部分。可以包含與當前頁面或主要內容相關的引用、側邊欄、廣告、導航條等信息。

【例2.14】 應用<aside>元素定義頁面側欄。（實例位置：資源包\TM\sl\2\9）

頁面運行結果如圖2.16所示。

2.2.2 新增的input元素類型

HTML5中新增了很多input元素類型，這些新增元素的添加可以使程序員更加方便地創建頁面。HTML5新增的input元素類型如下。

email

將input元素的類型設置為email，表示文本框必須輸入Email地址。

url

url表示必須輸入URL地址。

number

number表示必須輸入數值的文本框。

range

range表示必須輸入一定范圍內數字值的文本框。