HTML5和以前HTML4的區(qū)別整理

HTML5是HTML標(biāo)準(zhǔn)的下一個(gè)版本。雖然HTML5沒有完全顛覆HTML4,但是它們也有一些不同。最新最全的HTML5-HTML4對(duì)比信息請(qǐng)看http://dev.w3.org/html5/html4-differences/,貌似略多的樣子。在這個(gè)IE還仍然存在的世界里,HTML5的差別先掌握一些即可,等全部支持后再細(xì)細(xì)研究也不遲。
1. 簡(jiǎn)化的語法
HTML5簡(jiǎn)化了很多細(xì)微的語法,例如doctype的聲明,你只需要寫<!doctype html>就行了。HTML 5 指定 UTF-8 編碼的方式如下<meta charset="UTF-8">
2. <canvas>標(biāo)簽替代Flash
Flash給很多Web開發(fā)者帶來了麻煩,要在網(wǎng)頁(yè)上播放Flash需要一堆代碼和插件。<canvas>標(biāo)簽使得開發(fā)者只要使用一個(gè)標(biāo)簽就能和用戶產(chǎn)生UI交互。
3 新增許多標(biāo)簽
HTML5設(shè)計(jì)的一個(gè)原則是更好的體現(xiàn)網(wǎng)站的語義性,所以增加了<header>和<footer>這樣的標(biāo)簽,用來明確表示網(wǎng)頁(yè)的結(jié)構(gòu);新增 <section> 和 <article> 標(biāo)簽,<section>和<article>也有利于清晰化網(wǎng)頁(yè)的結(jié)構(gòu),更有利于SEO;新增 <menu> 和 <figure> 標(biāo)簽,<menu>可以被用于創(chuàng)建傳統(tǒng)的菜單,也可以用于工具欄和上下文菜單。<figure>標(biāo)簽使得網(wǎng)頁(yè)文字和圖片的排版更專業(yè); 新增 <audio> 和 <video> 標(biāo)簽,這兩個(gè)標(biāo)簽可能是HTML5里面最有用的兩個(gè)標(biāo)簽了,使用起來時(shí)也異乎方便,如在HTML5頁(yè)面中嵌入視頻只需一小段
<video width="450" height="340" controls>
<source src="jamshed.mp4" type="video/mp4">
Your browser does'nt support video embedding feature.
</video>
同理,音頻等其他的也類似。
4. 全新的表單
HTML5對(duì) <form> 和 <forminput> 標(biāo)簽進(jìn)行了大量修改,添加了很多新的屬性,也修改了很多屬性,詳細(xì)http://www.dbjr.com.cn/w3school/html5/html_5_form_attributes.htm
5. 刪除 <b> 和 <font> 標(biāo)簽,<frame>, <center>, <big> 標(biāo)簽
6.HTML5 支持了不同類型的存儲(chǔ)類型
HTML5 支持本地存儲(chǔ),在之前版本中是通過 Cookie 實(shí)現(xiàn)的。HTML5 本地存儲(chǔ)速度快而且安全。并且HTML5有兩種不同的對(duì)象可用來存儲(chǔ)數(shù)據(jù),HTML5通過JS來存儲(chǔ)和訪問數(shù)據(jù):
localStorage 適用于長(zhǎng)期存儲(chǔ)數(shù)據(jù),瀏覽器關(guān)閉后數(shù)據(jù)不丟失
sessionStorage 只是針對(duì)一個(gè)session的數(shù)據(jù)存儲(chǔ),存儲(chǔ)的數(shù)據(jù)在瀏覽器關(guān)閉后自動(dòng)刪除
總的來說,HTML5已經(jīng)超越了標(biāo)記語言的范疇,更富語義的標(biāo)簽將使得HTML5更有用處。Canvas+WEBGL等技術(shù),實(shí)現(xiàn)無插件的動(dòng)畫以及圖像、圖形處理能力;本地存儲(chǔ),可實(shí)現(xiàn)offline應(yīng)用;websocket,一改http的純pull模型,實(shí)現(xiàn)數(shù)據(jù)推送的夢(mèng)想;MathML,SVG等,支持更加豐富的render等等等等,現(xiàn)在對(duì)于對(duì)HTML5的了解還只停留在表面階段,以后會(huì)多閱讀一部分HTML5的書籍增加一下見識(shí)。
相關(guān)文章
HTML5對(duì)比HTML4的主要改變和改進(jìn)總結(jié)
HTML5是HTML5的第五版便準(zhǔn),目前已獲各瀏覽器的廣泛支持,這里我們來整理一下HTML5對(duì)比HTML4的主要改變和改進(jìn)總結(jié),需要的朋友可以參考下2016-05-27Web時(shí)代變遷及html5與html4的區(qū)別
HTML5是HTML標(biāo)準(zhǔn)的下一個(gè)版本。越來越多的程序員開始HTML5來構(gòu)建網(wǎng)站。如果你同時(shí)使用HTML4和HTML5的話,你會(huì)發(fā)現(xiàn)用HTML5從頭構(gòu)建,比從HTML4遷移到HTML5要方便很多。雖然H2016-01-06HTML與XHTML、以及HTML4與HTML5標(biāo)簽之間的區(qū)別簡(jiǎn)介
這篇文章主要介紹了HTML與XHTML、以及HTML4與HTML5標(biāo)簽之間的區(qū)別,是網(wǎng)頁(yè)前端編程入門學(xué)習(xí)中的基礎(chǔ)知識(shí),需要的朋友可以參考下2015-11-07HTML5標(biāo)簽與HTML4標(biāo)簽的區(qū)別示例介紹
HTML5專注內(nèi)容與結(jié)構(gòu),而不專注的表現(xiàn);HTML5在更多的聲明和標(biāo)簽上面做了簡(jiǎn)化,下面為大家提供了一個(gè)HTML5簡(jiǎn)單示例,大家可以參考下2013-07-18html4和html5區(qū)別之如何在一個(gè)input上添加焦點(diǎn)實(shí)現(xiàn)代碼
如何在一個(gè)input上添加焦點(diǎn),有很多的實(shí)現(xiàn)方法,本文分別用html4和html5做了下演示,感興趣的朋友可以參考下,或許本文對(duì)你有所幫助2013-02-07淺談HTML5與HTML4的10個(gè)關(guān)鍵區(qū)別
下面小編就為大家?guī)硪黄獪\談HTML5與HTML4的10個(gè)關(guān)鍵區(qū)別。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-05-31