HTML 5 新增的元素_Web標(biāo)準(zhǔn)教程
在本人看來，HTML 5是一個(gè)妥協(xié)方案，雖不激進(jìn)，但更能推動(dòng)技術(shù)的繼續(xù)進(jìn)步。沒有命名空間，元素也不要求閉合（當(dāng)然這并不是優(yōu)點(diǎn)），瀏覽器也可以寬大處理一些錯(cuò)誤。一切沿襲上個(gè)世紀(jì)HTML 4的做法。對(duì)于HTML的渲染，瀏覽器一直停留在1999年的水平。為此，HTML 5是一個(gè)實(shí)用主義方案，這樣不僅可以繼續(xù)處理這么多年來散落在世界各個(gè)角落的HTML，也可以讓瀏覽器廠商更輕易添加新特性。這就叫degrade gracefully（優(yōu)雅降級(jí)）。讓我們來看看HTML 5增加的一些新元素。
結(jié)構(gòu)元素
這真是大快人心。目前，我們定義結(jié)構(gòu)只能通過一個(gè)“萬(wàn)能”的div, 試圖通過設(shè)置它的特性id的值如header, footer, sidebar等來分別表達(dá)頭部，底部或者側(cè)欄等。有了它們，代碼編寫者不再需要為id的命名費(fèi)盡心思，對(duì)于手機(jī)、閱讀器等設(shè)備更有語(yǔ)義的好處。HTML 5增加了新的結(jié)構(gòu)元素來表達(dá)這些最常用的結(jié)構(gòu)：
section: 這可以表達(dá)書本的一部分或一章，或者一章內(nèi)的一節(jié)
header: 頁(yè)面主體上的頭部。并非head元素
footer: 頁(yè)面的底部（頁(yè)腳），可以是一封郵件簽名的所在
nav: 到其他頁(yè)面的鏈接集合
article: 諸如blog, 雜志，綱要等之中的一條獨(dú)立記錄。
舉個(gè)例子，一個(gè)blog的首頁(yè)，用HTML 5寫的話，可以是這樣（有省略）：
| 以下為引用的內(nèi)容： <<!DOCTYPE HTML> aside <aside> <figure> <dialog> |
m元素用來標(biāo)記一些不是那么需要著重強(qiáng)調(diào)的文本�，F(xiàn)在尚有爭(zhēng)議，可能最終會(huì)改為mark.
time元素如其名，用來表達(dá)時(shí)間。它需要一個(gè)datetime的特性來標(biāo)明機(jī)器能夠熟悉的時(shí)間，如：
<time datetime="2008-08-08T20:08:08">2008年8月8日晚上8時(shí)8分8秒</tiem>meter元素表達(dá)特定范圍內(nèi)的數(shù)值。可用于薪水、百分比、分?jǐn)?shù)等。比如：
很遺憾地告訴你，我只有<meter>150cm</meter>它還有6個(gè)特性來表達(dá)各方面的含義，比如：
<p>您的分?jǐn)?shù)是：<meter value="88.7" min="0" max="100" low="65" high="96" optimum="100">B </meter>.</p>
還有一個(gè)progress，也是義如其名，用以表達(dá)進(jìn)度：
目標(biāo)完成度：<progress value="40" max="100">40%</progress>嵌入多媒體
新增video和audio元素。顧名思義，分別是用來插入視頻和聲音的。至于格式，交由瀏覽器實(shí)現(xiàn)，HTML再也不需要非凡的代碼去播放特定的格式。就像img一樣，不管是png, jpg還是gif都可以顯示。值得注重的是，它們可以包含內(nèi)容。比如，可以把歌詞放到某段歌曲中去：
| 以下為引用的內(nèi)容： <audio src="誰(shuí)人伴你睡.mp3"> <p>淚枯干</p> <p>難忍怎么委屈自已</p> <p>曾經(jīng)有一刻悲與喜</p> ... </audio> |
交互性
HTML 5同時(shí)也叫Web Applications 1.0, 因此也進(jìn)一步發(fā)展交互能力。這些標(biāo)簽就是為提高頁(yè)面的交互體驗(yàn)而生：
| 以下為引用的內(nèi)容： details datagrid menu command |
details
用來表示一段具體的內(nèi)容，但是內(nèi)容默認(rèn)可能不顯示，通過某種手段（如點(diǎn)擊）與legend交互才顯示出來。這跟現(xiàn)在各種通過JavaScript隱藏一段內(nèi)容，在點(diǎn)擊后才顯示出來的做法有些類似。比如：
一句話記錄生活中的點(diǎn)點(diǎn)滴滴，
| 以下為引用的內(nèi)容： <details> <legend>更多</legend> <p>交流與分享，拉近你和朋友，支持 MSN/GTalk/QQ、短信、手機(jī) WAP</p> </details>它可以有一個(gè)open的特性，用來顯示細(xì)節(jié)與否。 |
datagrid用來控制數(shù)據(jù)，可以由用戶或者腳本來更新。
menuHTML 2就存在了，不過HTML 4把它廢棄了。HTML 5廢物利用，并在期內(nèi)加上command元素。
參考：New elements in HTML 5
- Web標(biāo)準(zhǔn)：需要正確的使用H1~ H6標(biāo)簽
- 五個(gè)WEB標(biāo)準(zhǔn)中必須注意的地方
- 做到結(jié)構(gòu)(XHTML)，表現(xiàn)(CSS)，行為(JavaScript)的分離
- CSS標(biāo)準(zhǔn):HTML標(biāo)簽元素的關(guān)閉
- Web標(biāo)準(zhǔn)之路 勿使用W3C廢棄的元素
- CSS布局 聲明文檔類型描述(DTD)
- DIV CSS\讓搜索引擎蜘蛛不再累
- 用XHTML+CSS創(chuàng)建基于Web標(biāo)準(zhǔn)的網(wǎng)頁(yè)
- XHTML+CSS創(chuàng)建基于Web標(biāo)準(zhǔn)的網(wǎng)站
- DIV+CSS對(duì)SEO的幫助
- 淺析什么是Web標(biāo)準(zhǔn) 及其前景
- CSSer新手寄語(yǔ)：開始標(biāo)準(zhǔn)之路
Web標(biāo)準(zhǔn)教程Rss訂閱Div+Css教程搜索
Web標(biāo)準(zhǔn)教程推薦
- CSS調(diào)試工具M(jìn)ultipleIE-IE5IE6IE7多版本共存
- CSS網(wǎng)友：關(guān)于WEB標(biāo)準(zhǔn)化過程中的語(yǔ)義化描述！
- Microsoft于2008年2月12日將瀏覽器強(qiáng)制升級(jí)至IE7
- Web2.0網(wǎng)站十五個(gè)顯著的流行風(fēng)格
- 一個(gè)網(wǎng)友觀點(diǎn)：兩年以來使用DIV排版的經(jīng)驗(yàn)！
- word-wrap同word-break的區(qū)別
- 并沒有WEB標(biāo)準(zhǔn)，有的只是建議
- CSS+DIV:讓文本字符環(huán)繞在你的圖片周圍
- WebDeveloper更新最新版本W(wǎng)ebDeveloper1.1.4
- 定義標(biāo)題的最好方法
- 相關(guān)鏈接：
- 教程說明：
Web標(biāo)準(zhǔn)教程-HTML 5 新增的元素
。