HTML4和HTML5之間的主要不同點

時間：2024-07-30 21:15:18 HTML5 我要投稿

相關推薦

HTML4和HTML5之間的主要不同點

　　HTML超文本標記語言（英文：HyperText Markup Language）是用于描述網頁文檔的一種標記語言。HTML是Web編程的基礎，也就是說萬維網是建立在超文本基礎之上的，萬維網主要由從服務器通過HTTP協議向瀏覽器發送的HTML文檔組成。1997年W3C已經正式推薦當今主流的HTML4.0標準。

　　HTML5是一個還未完成的標準，而HTML4已經正式使用了10多年了，它仍是當前主流的標準。由于HTML5現在并沒有廣泛地運用，而且搜索引擎支持效果也不佳，現在用HTML5來制作網頁并不會給你的網站帶來什么好處。重新開發一個HTML5的網站，也要比把一個網站從HTML4遷移到HTML5上容易的多，這是因為這兩個版本之間有很大不同之處，下面介紹HTML4和HTML5之間的主要不同：

　　一、新的<video>和<audio>標記替代FLASH

　　<canvas>、<source>、<video>和<audio>通過一個標準接口嵌入圖片、音頻和視頻多媒體，而無需安裝任何插件。

　　<audio>和<video>以替代<object>和<embed>標記。

　　Canvas由一個可繪制地區HTML代碼中的屬性定義決定高度和寬度。JavaScript代碼可以訪問該地區，通過一套完整的繪圖功能類似于其他通用二維的API，從而使動態生成的圖形。

　　如通過<canvas>元素來顯示一個紅色的矩形：

　　<canvas id="myCanvas"></canvas><script type="text/javascript">var canvas=document.getElementById('myCanvas');var ctx=canvas.getContext('2d');ctx.fillStyle='#FF0000';ctx.fillRect(0,0,80,100);</script>

　　二、新的<section><article><header><footer>和<nav>標記

　　HTML5的設計是要更好的描繪網站的解剖結構，類似<p>和<span>的標簽<section>、<article>、<header>和<nav>（網站導航塊）有利于搜索引擎的索引整理，也便于小屏幕裝置和視障人士使用。

　　隨著HTML5的到來，無處不在的<p id="header">和<p id="footer">傳統代碼方法，將變成標簽<Header>和<footer>。

　　三、新的<menu>和<figure>標記

　　新的<menu>標記可以被用作普通的菜單，也可以用在工具條和右鍵菜單上。新的<figure>標記是一種更專業的管理頁面上文字和圖像的方式。

　　四、全新的<form>標記

　　新的<form>標記對原有的表單元素進行的全新的修改，用于創建供用戶輸入的HTML表單。<form>元素包含一個或多個表單元素，其中<input>標簽規定用戶可輸入數據的輸入字段。

　　HTML5中的新標簽：

　　<article>：定義了一個文檔內容的獨立片段，比如博客條目或報紙文章。

　　<aside>：定義頁面內容之外的內容，aside的內容應該與附近的內容相關。

　　<audio>：定義聲音內容。

　　<canvas>：定義圖形。

　　<command>：定義命令按鈕，比如單選按鈕、復選框。

　　<datagrid>：定義樹列表(tree-list)中的數據。

　　<datalist>：定義下拉列表。

　　<datatemplate>：定義數據模板。

　　<details>：定義元素的細節。

　　<dialog>：定義對話（會話）。

　　<embed>：定義外部交互內容或插件。

　　<figure>：定義媒介內容的分組，以及它們的標題。

　　<figcaption>：定義figure元素的標題。figcaption元素應該被置于figure元素的第一個或最后一個子元素的位置，它是可選的。

　　<footer>：定義section或page的頁腳。

　　<header>：定義section或page的頁眉。

　　<m>：定義有記號的文本，請在需要突出顯示文本時使用<m>標簽。

　　<meter>：定義預定義范圍內的度量。

　　<nav>：定義導航鏈接。

　　<nest>：定義數據模板中的嵌套點。

　　<output>：定義輸出的一些類型。

　　<progress>：定義任何類型的任務的進度。

　　<rule>：為升級模板定義規則。

　　<section>：定義文檔中的節（section、區段）。比如章節、頁眉、頁腳或文檔中的其他部分。

　　<source>：定義媒介源。

　　<time>：定義日期或時間。

　　<video>：定義視頻，比如電影片段或其他視頻流。

　　五、一些過時的HTML4標記將取消

　　如<big><font>和<center>，因為它們已經被CSS取代。

　　HTML5不再支持的HTML4標簽：

　　<acronym>：定義首字母縮寫。

　　<applet>：定義applet。

　　<big>：定義大號字體效果，請使用<b>或<strong>標簽代替（<strong>標簽表示把文本標記為相比其他文本更為重要，<b>標簽在HTML5中被重新定義為文本中需要強調的部分）。

　　<center>：定義居中的文本。

　　<dir>：定義目錄列表。

　　<basefont>：請使用CSS代替。

　　<font>：定義文本的字體、尺寸和顏色。

　　<frame>：定義子窗口（框架）。

　　<frameset>：定義框架的集。

　　<isindex>：定義單行的輸入域。

　　<noframes>：定義noframe部分。

　　<s>：定義加刪除線的文本。（同strike）

　　<strike>：定義加刪除線的文本，請使用<del>標簽代替。

　　<u>：定義下劃線文本。

　　<tt>：定義打字機文本。

　　六、<a><cite>和<menu>被修改、重新定義或標準化了

　　沒有href屬性的a元素代表一個假設可能放置一個鏈接的占位符。

　　<b>標簽在HTML5中仍是粗體，但被重新定義為文本中需要強調的部分。

　　<head>元素不再允許object元素作為子元素。

　　<hr>元素顯示為一條水平線，代表一個段段專題間斷，不再支持align,noshade,size以及width屬性。

　　<strong>元素現在代表重要性而不是強烈的強調。

　　<small>元素現在代表注釋的小字（旁注）。

　　<cite>定義引用，可使用該標簽對參考文獻的引用進行定義，比如書籍或雜志的標題，引用的文本將以斜體顯示。

　　<i>標簽依然是斜體樣式，但它的意義已經和之前有所不同，HTML5中只是為了將一段文字標識出來，而不是為了設置斜體。

　　七、HTML4部分元素變更了屬性

　　table的border屬性只允許值為"1"以及空字符。

　　img的border屬性不再允許。

　　img和其他元素的width和height屬性不再允許包含百分比。

　　八、HTML4部分元素引入了幾個新屬性

　　為了和link元素的一致性，a和area（定義圖像映射中的區域）元素現在有了media屬性。

　　為了和a和link元素的一致性，area元素現在也有了hreflang、type和rel屬性。

　　主要為了和a元素的一致性，base元素也有了target屬性。（這已被廣泛支持）

　　script元素有了一個新屬性async，可以影響腳本的加載和執行。

　　九、<noscript>標簽將會被大量使用

　　HTML5時代將會是一個富媒體時代。傳統的文字、圖片、鏈接、音頻、視頻已經滿足不了用戶不斷增長的需求，大量的腳本能夠編輯出豐富的信息，包括游戲、個性化設計和交互式設計等。<noscript>元素用來定義在腳本未被執行時的替代文本內容，就如同<img>標簽中的alt屬性。

　　HTML中很少用到但HTML5中可能很有用的標簽：

　　<abbr>：表示一個縮寫形式，比如「Inc.」、」etc.」。最初是在HTML4.0中引入的，表示它所包含的文本是一個更長的單詞或短語的縮寫形式。

　　<address>：定義文檔作者或擁有者的聯系信息。

　　<bdo>：定義文本顯示的方向。

　　<blockquote>：定義摘自另一個源的塊引用。<blockquote>與</blockquote>之間的所有文本都會從常規文本中分離出來，經常會在左、右兩邊進行縮進，而且有時會使用斜體。也就是說，塊引用擁有它們自己的空間。

　　<dl>：定義一個定義列表。

　　<dt>：定義一個定義列表中的一個項目，以及dialog中的角色。

　　<dd>：定義一個定義列表中對項目的描述。

　　<del>：定義文檔中已刪除的文本。（與<ins>一起使用，描述文檔中的更新和修正。）

　　<ins>：定義插入文本。（與<del>標簽一起使用，來描述對文檔的更新和修正。）

　　<fieldset>：將表單內的相關元素分組。

　　<legend>：為<fieldset>、<figure>以及<details>元素定義標題。

　　<menu>：定義菜單列表。當希望列出表單控件時使用該標簽。（請使用CSS來定義列表的類型。）

　　<q>：定義一個短的引用。（瀏覽器經常會在這種引用的周圍插入引號。）

　　十、新增事件屬性

　　HTML5元素可擁有事件屬性，這些屬性在瀏覽器中觸發行為，比如當用戶單擊一個HTML5元素時啟動一段JavaScript。下面列出的事件屬性，可以把它們插入HTML標簽來定義事件行為。

　　HTML5中的新事件屬性舉例：

　　onafterprint：在打印文檔之后運行腳本

　　onbeforeunload：在文檔加載之前運行腳本

　　onerror：當錯誤發生時運行腳本

　　onforminput：當表單獲得用戶輸入時運行腳本（表單事件）

　　ondrag：當拖動元素時運行腳本（鼠標事件）

　　onmousewheel：當轉動鼠標滾輪時運行腳本

　　onplaying：當媒介數據已開始播放時運行腳本（媒介事件）

　　onwaiting：當媒介已停止播放但打算繼續播放時運行腳本

【HTML4和HTML5之間的主要不同點】相關文章：

HTML5和HTML4有何區別？03-28

HTML5的發展03-27

危機公關和危機管理、危機傳播之間的關系和作用11-16

靈芝的藥理性能和主要作用03-08

紋眉繡眉和飄眉之間的區別03-20