HTML 和 HTML5 之間的區別 · Guru99 中文系列教程

# HTML 和 HTML5 之間的區別 > 原文： [https://www.guru99.com/html-vs-html5.html](https://www.guru99.com/html-vs-html5.html) 在學習 HTML 與 HTML5 之前，讓我們學習： ## 什么是標記語言？標記語言是一種系統設計，用于以語法上可區分的方式注釋文檔。它使用標簽來定義元素。標記語言包含英語短語和單詞。因此，它們很容易閱讀。標記語言是專門為處理，定義和顯示文本而設計的。在本 HTML vs HTML 5 教程中，您將學習： * [什么是標記語言？](#1) * [什么是 HTML？](#2) * [什么是 HTML5？](#3) * [HTML 的結構](#4) * [HTML5 的結構](#5) * [HTML](#6) 的功能 * HTML5 的[功能](#7) * [HTML 與 HTML5](#8) * [HTML 的優點](#9) * [HTML5 的優點](#10) * [HTML](#11) 的缺點 * [HTML5 的缺點](#12) ## 什么是 HTML？ HTML 是用于萬維網的語言。它是用于在 Web 上創建和顯示頁面的標準文本格式語言。 HTML 文件由兩部分組成：1）內容和 2）對其進行格式化以在頁面上正確顯示的標簽。級聯樣式表（CSS）等技術和 JavaScript 等腳本語言可以使用它。 HTML 的完整形式是超文本標記語言。它也被稱為 HTML v 1.0，并且是 HTML 標記的第一版。 ## 什么是 HTML5？ HTML5 是 HTML 版本 1.0 的第 5 個<sup>版本</sup>，并支持更多標簽和功能。從技術上講，它稱為 HTML 版本 5.0，但通俗地說，它稱為 HTML5。 Safari，Opera，Chrome 和 Firefox 等最新版本的瀏覽器支持 HTML5 的所有大部分功能。 Web 開發人員可以使用 HTML5 開發照片網站，Web 論壇和高級地圖繪制應用程序。 HTML5 的完整形式是超文本標記語言 5。 ## HTML 的結構這是 HTML 的結構： ``` <!DOCTYPE html> <html> <head> <title>Guru99 Home</title> </head> <body> <h1>Best Tutorials on Planet</h1> <p>Paragraph</p> </body> </html> ``` ## HTML5 的結構這是 HTML5 的結構： ``` <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>HTML5 Title</title> <meta name="description" content=" HTML5 Title"> <meta name="author" content="Guru99"> <link rel="stylesheet" href="/css/styles.css?v=1.0"> </head> <body> <script src="/js/scripts.js"></script> </body> </html> ``` ## HTML 的功能 * 平臺無關的語言。 * 它不是區分大小寫的語言。 * 您可以使用級聯樣式表控制顏色，字體和位置。 * 我們可以建立表格。 * 使用 HTML 元素增強頁面的呈現。 * 使您能夠使用標簽開發網頁。 * 使用圖形，并以各種字體，大小和顏色顯示文本。 * 它可以幫助您創建超鏈接以導航到網絡上存在的各種文檔。 * 您可以以表格格式顯示數據。 * 在網頁中創建多個窗口，以顯示來自不同窗口中多個來源的信息。 ## HTML5 的功能 * 它支持本地存儲 * HTML5 具有與內容相關的新元素，例如<標頭>，<頁腳>，<文章>，<部分>，<導航>等。 * 它提供了新的表單控件，例如日期，日歷，時間，URL，電子郵件和搜索。 * 用于繪制 2D 圖的<畫布>元素 * 支持 CSS3（CSS 的較新版本）。 * 提供媒體支持。 * 圖形元素可以與元素組合以輕松將標題與其他圖像元素相關聯。 * 您可以在本地存儲大量數據，而不會影響站點性能。 * HTML 能夠處理錯誤的語法。 ## HTML 與 HTML5 ![](https://img.kancloud.cn/1a/58/1a58ebc7012f96c53165698b414c0b72_683x188.png) 以下是 HTML 和 HTML5 之間的區別： | **HTML** | **HTML5** | | HTML Doctype 聲明很長。 | HTML5 中的 DOCTYPE 聲明很簡單。 | | HTML 字符編碼更長。 | HTML5 字符編碼聲明很簡單。 | | 音頻和視頻不是 HTML 部分。 | 音頻和視頻是 HTML5 的一部分。 | | 可以借助 Silverlight，Flash，VML 等其他技術來繪制矢量。 | 矢量圖形是 HTML5 的一部分，例如 canvas，SVG。 | | 無法獲得瀏覽任何網站的人的實際地理位置。 | HTML5 中的 JS Geolocation API 使您可以識別瀏覽任何網站的用戶的位置。 | | HTML 提供本地存儲而不是 cookie。 | HTML5 使用 Cookie 來存儲數據。 | | 在 HTML 中，無法繪制基本形狀。 | 在 Html5 中，可以繪制基本形狀。 | | 它允許您在瀏覽器中運行 JavaScript。 | 它使您能夠在后臺運行 JavaScript 代碼。 | | 您可以在所有舊瀏覽器中使用 HTML。 | 您可以在所有新的瀏覽器中使用 HTML5。 | | 您可以將瀏覽器緩存用作臨時存儲。 | 您可以將應用程序（數據庫和 Web 存儲）緩存用作臨時存儲。 | | Web 套接字不可用。 | 您可以使用 Web 套接字與服務器建立全雙工通信通道。 | | 沒有處理結構錯誤的 HTML 代碼的過程。 | HTML5 通過臨時的錯誤處理過程支持持久性錯誤處理。 | | HTML 不太適合移動設備使用。 | HTML5 對移動設備友好。 | | HTML 中不存在諸如 async，charset 和 ping 之類的屬性。 | 異步，ping，字符集和的屬性是 HTML5 的一部分。 | | HTML 不允許拖放效果 | HTML5 允許拖放效果。 | | 提供新的屬性，例如 tabinex，id，tabinex 等。 | 這些是應用于 HTML 5 元素的某些屬性。 | ## HTML 的優點以下是 HTML 的優點/優點： * 易于使用的網頁開發 * 輕松創建 Web 文檔 * 它可以幫助您在網頁內以及位于不同服務器上的網站之間導航。 * 在 HTML 中，您可以設置查詢以使用本質上具有響應性的圖像。 * 用戶無法保存跨會話保留的瀏覽器數據。 * 一旦數據存儲在瀏覽器中，開發人員就可以進一步考慮以使應用程序正常工作。 ## HTML5 的優點以下是 HTML5 的優點/優點： * 它具有與文件系統，客戶端存儲，事件處理等有關的大量新 API 一樣的功能。 * 輕松創建一個新的交互式網站。 * 由于 HTML5 采用務實的方法，因此您可以輕松解決實際問題。 * 它簡化了 Doctype 和字符集。 * HTML5 提供了<詳細信息>，<對話框>，<標記>等元素。 * 它改進了 Web 表單，并為<輸入>標簽提供了新屬性。 * HTML5 提供了持久的本地存儲，以便在不借助任何第三方插件的情況下實現。 * 它具有 WebSocket，這是用于開發 Web 應用程序的下一代通信技術。 * HTML5 引入了稱為服務器發送事件（SSE）的事件。 * 它簡化了標記 * 支持可以使用 JavaScript 編程的二維繪圖面。 * HTML5 使您可以創建自己的詞匯表。 * 您可以創建自己的自定義語義。 * 將項目從同一網頁上的一個位置拖放到另一位置。 * 支持眾多視頻。 * HTML5 借助可見性，媒體捕獲，全屏等 API 增強了 Web 應用程序體驗。 ## HTML 的缺點這是 HTML 的缺點/缺點： * HTML 不能幫助創建動態頁面。它只能創建普通頁面。 * 您可能需要編寫冗長的代碼才能制作簡單的網頁。 * HTML 的安全功能不好。 * 開發甚至類似于網頁的內容都需要花費時間。 * HTML 不像 Dreamweaver 之類的其他網頁開發軟件那樣靈活。 * 它沒有遵循集中式方法。您需要單獨編輯網頁。 ## HTML5 的缺點這是 HTML5 的缺點/缺點： * 它需要現代的瀏覽器才能訪問它。 * 存在與媒體許可有關的問題。 * 多設備響應可能令人頭疼。 * HTML5 語言仍在開發中。 * 在 HTML5 下使用 JavaScript 進行游戲苦苦掙扎。 * HTML5 中沒有可用的優秀 IDE。 ## 關鍵區別： * HTML Doctype 聲明很長，而 HTML5 中的 DOCTYPE 聲明更簡單。 * 音頻和視頻不是 HTML 的一部分，而 HTML5 支持音頻和視頻標簽。 * 在 HTML 中，Web 套接字不可用，另一方面，在 HTML5 中，您可以使用 Web 套接字與服務器建立全雙工通信通道。 * HTML 不太適合移動設備，而 HTML5 則適合移動設備。 * 無法獲得使用 HTML 瀏覽任何網站的人的實際地理位置，而 HTML5 中的 JS Geolocation API 使您可以識別瀏覽任何網站的用戶的位置。