當前位置:才華齋>設計>網頁設計>

HTML5和HTML4有何區別?

網頁設計 閱讀(1.3W)

HTML5是HTML標準的下一個版本。雖然HTML5沒有完全顛覆HTML4,但是它們也有一些不同。下面是YJBYS小編為大家搜尋整理的關於HTML5和HTML4的區別,歡迎參考閱讀,希望對你有所幫助!想了解更多相關資訊請持續關注我們應屆畢業生培訓網!

HTML5和HTML4有何區別?

  1. 簡化的語法

HTML5簡化了很多細微的語法,例如doctype的宣告,你只需要寫<!doctype html>就行了。HTML 5 指定 UTF-8 編碼的方式如下

<meta charset="UTF-8">

2.Flash給很多Web開發者帶來了麻煩,要在網頁上播放Flash需要一堆程式碼和外掛。<canvas>標籤使得開發者只要使用一個標籤就能和使用者產生UI互動。

  3. 新增許多標籤

HTML5設計的一個原則是更好的體現網站的語義性,所以增加 了<header>和<footer>這樣的標籤,用來明確表示網頁的結構;新增 <section> 和 <article> 標籤,<section>和<article>也有利於清晰化網頁的結構,更有利於SEO;新增 <menu> 和 <figure> 標籤,<menu>可以被用於建立傳統的選單,也可以用於工具欄和上下文選單。<figure>標籤使得網頁文字和圖片的排版更 專業; 新增 <audio> 和 <video> 標籤,這兩個標籤可能是HTML5裡面最有用的兩個標籤了,使用起來時也異乎方便,如在HTML5頁面中嵌入視訊只需一小段。

複製程式碼程式碼如下:

<video width="450" height="340" controls>
  <source src="4" type="video/mp4">
  Your browser does'nt support video embedding feature.
  </video>

同理,音訊等其他的也類似。

  4. 全新的表單

HTML5對 <form> 和 <forminput> 標籤進行了大量修改,添加了很多新的屬性,也修改了很多屬性

  5. 刪除 <b> 和 <font> 標籤,<frame>, <center>, <big> 標籤

  6. HTML5 支援了不同型別的儲存型別

HTML5 支援本地儲存,在之前版本中是通過 Cookie 實現的。HTML5 本地儲存速度快而且安全。並且HTML5有兩種不同的物件可用來儲存資料,HTML5通過JS來儲存和訪問資料:

localStorage 適用於長期儲存資料,瀏覽器關閉後資料不丟失

sessionStorage 只是針對一個session的資料儲存,儲存的`資料在瀏覽器關閉後自動刪除

總的來說,HTML5已經超越了標記語言的範疇,更富語義的標籤將使得HTML5更有用處。Canvas+WEBGL等技術,實現無外掛的動畫以及 影象、圖形處理能力;本地儲存,可實現offline應用;websocket,一改http的純pull模型,實現資料推送的夢 想;MathML,SVG等,支援更加豐富的render等等等等,現在對於對HTML5的瞭解還只停留在表面階段,以後會多閱讀一部分HTML5的書籍 增加一下見識。