新千年以來，超文本標記語言（HTML）5 第一次向 Html 中引入新的元素。
新的結構元素包括 aside、figure 和 section。
新的內聯元素包括 time、meter 和 progress。
新的內嵌元素有 video 和 audio。新的交互元素有 details、datagrid 和 command。
■Html5的結構 section：這可以是書中的一章或一節，實際上可以是在 Html 4 中有自己的標題的任何東西 header：頁面上顯示的頁眉；與 head 元素不一樣 footer：頁腳；可以顯示電子郵件中的簽名 nav：指向其他頁面的一組鏈接 article：blog、雜志、文章匯編等中的一篇文章必須分析標題的級別，才能看出各個部分的劃分方式。邊欄、頁腳、頁眉、導航條、主內容區和各篇文章都由通用的 div 元素來表示
Html 5 增加的塊級元素：除了結構性元素之外，Html 5 還增加了一些純語義性的塊級元素：
aside figure dialogaside 元素代表說明、提示、邊欄、引用、附加注釋等，也就是敘述主線之外的內容。
figure 元素代表一個塊級圖像，還可以包含說明。figure 元素不只可以顯示圖片。還可以使用它給 audio、video、iframe、object 和 embed 元素加說明。
dialog 元素表示幾個人之間的對話。HTML 5 dt 元素可以表示講話者，Html 5 dd 元素可以表示講話內容。所以，在老式浏覽器中也可以以合理的方式顯示對話。
Html 5 增加的語義性內聯元素HTML 4 用 5 個不同的內聯元素表示略有差異的計算機代碼：var、code、kbd、tt 和 samp。但是，它無法表示時間、數字等基本數值。Html 5 提供了幾個新的內聯元素來滿足非技術作者的需求。
m 元素表示文本被 “加上標志”，但是不一定要強調。可以把它想像成書中突出顯示的一節。Google 的緩存頁面就是典型的用例。如果鏈接到一個緩存的副本，搜索詞就被加上標志。例如，如果搜索 “Egret”，那麼緩存的 Google 頁面可能像下面這樣：
Html源代碼 <bThe Great <m>Egret</m> (also known as the American <m>Egret</m>) is a large white wading bird found worldwide. The Great <m>Egret</m> flies with slow wing beats. The scIEntific name of the Great <m>Egret</m> is <i>Casmerodius albus</i>.time
time 元素表示一個時間值，比如 5:35 P.M., EST, April 23, 2007。例如：
Html源代碼<p>I am writing this example at <time>5:35 P.M. on April 23rd</time>. </p>time 元素可以幫助浏覽器和其他程序識別出 Html 頁面中的時間。它不要求對元素內容應用任何特定的格式。但是，每個 time 元素都應該有一個 datetime 屬性，其中包含更適合機器識別的時間值，比如：
Html源代碼<p>I am writing this example at <time datetime="2007-04-23T17:35:00-05:00">5:35 P.M. on April 23rd</time>. </p>meter
meter 元素表示指定范圍內的數字值。例如，可以用它表示薪水、投票給 Le Pen 的法國選民的百分比或考試分數。在這裡，我使用 meter 標出 Software Development 2007 上一位 Google 程序員提供的數據：
Html源代碼<p>An entry level programmer in Silicon Valley can expect to start around <meter>$90,000</meter> per year. </p>meter 元素幫助浏覽器和其他客戶機識別 Html 頁面中的數量。它不要求對元素內容應用任何特定的格式。但是，每個 meter 元素可以有最多 6 個屬性，它們按照更適合機器識別的形式表示這個數量：
value min low high max optimum這些屬性都應該包含一個十進制數字。例如，期末考試的分數可以寫成下面這樣：
Html源代碼<p>Your score was <meter value="88.7" min="0" max="100" low="65" high="96" optimum="100">B+</meter>. </p>progress
progress 元素表示一個正在進行的過程的狀態，就像圖形用戶界面（GUI）應用程序中的進度條。例如，可以用它表示一個文件已經下載的百分比或者播放電影時的當前位置。下面這個進度控件表示下載已經完成了 33%：
HTMl源代碼<p>Downloaded: <progress value="1534602" max="4603807">33%</progress> </p> Html5新增的內嵌的媒體引入一個新的 video 元素，用來嵌入任意視頻格式.例如，可以用以下代碼嵌入QuickTime 電影 “a Sora in Prospect Park”：
Html源代碼<video src="http://www.cafeaulait.org/birds/sora.mov" />引入 audio 元素。例如，可以使用以下代碼給 Web 頁面加上背景音樂：
Html源代碼<audio src="spacemusic.mp3" autoplay="autoplay" loop="20000" />autoplay 屬性指示浏覽器在裝載頁面後立即開始播放，而不等待明確的用戶請求
引入了img元素，用來支持所有圖片格式 。
Html5新增加的交互元素Html 5 也被稱為 Web Applications 1.0。為了實現這個目標，增加了幾個為 Web 頁面提供交互體驗的新元素：
details datagrid menu command這些元素都可以根據用戶的操作和選擇改變顯示的內容，而不需要從服務器裝載新頁面。
details
details 元素表示在默認情況下可能不顯示的詳細信息。可選的 legend 元素可以提供詳細信息的摘要。details 元素的用途之一是提供腳注和尾注。例如：
Html源代碼The bill of a Craveri's Murrelet is about 10% thinner than the bill of a Xantus's Murrelet. <details> <legend>[Sibley, 2000]</legend> <p>Sibley, David Allen, The Sibley Guide to Birds, (New York: Chanticleer Press, 2000) p. 247 </p> </details>沒有指定具體的顯示方式。浏覽器可以選用腳注、尾注和工具提示等方式。
每個 details 元素可以有一個 open 屬性。如果設置了這個屬性，那麼詳細信息在最初就顯示出來。如果沒有設置這個屬性，那麼會隱藏它們，直到用戶要求顯示它們。無論是哪種情況，用戶都可以通過單擊一個圖標或其他控件來顯示或隱藏詳細信息。
datagrid
datagrid 元素提供一個網格控件。可以用它顯示樹、列表和表格，用戶和腳本可以更新這些界面元素。與之相反，傳統的表格主要用來顯示靜態數據。
datagrid 從它的內容（一個 table、select 或其他 Html 元素）獲得初始數據。
這個元素與常規表格的區別在於，用戶可以選擇行、列和單元格；把行、列和單元格折疊起來；編輯單元格；刪除行、列和單元格；對網格排序；以及在客戶機浏覽器中直接進行其他數據操作。可以用 JavaScript 代碼監視更新。Document Object Model（DOM）中增加了 HtmlDataGridElement 接口以支持這個元素（清單 10）。
menu和command
menu 元素實際上在 HTML 2 中就出現了。在 HTML 4 中廢棄了它，但是 HTML 5 又恢復了它並指定了新的意義。在 Html 5 中，menu 包含 command 元素，每個 command 元素引發一個操作。例如一個彈出警告框的菜單。
還可以用 checked="checked" 屬性將命令轉換為復選框。通過指定 radiogroup 屬性，可以將復選框轉換為單選按鈕，這個屬性的值是互相排斥的按鈕的組名。
除了簡單的命令列表之外，還可以使用 menu 元素創建工具欄或彈出式上下文菜單，這需要將 type 屬性設置為 toolbar 或 popup。
label 屬性提供菜單的標題。例如，清單 14 顯示一個 Edit 菜單。