8 個你應該立即停止使用的無效 HTML 元素 HTML 規範的開發是一個漸進的過程,有時會出現問題。隨著時間的推移,許多元素和屬性被添加到 HTML 中,直到後來 Web 社區集體意識到有更好的方法時才被刪除。由於已棄用和過時的元素和屬性已經存在於網路上,因此許多現代瀏覽器繼續支持它們的使用。儘管 ...
8 個你應該立即停止使用的無效 HTML 元素
HTML 規範的開發是一個漸進的過程,有時會出現問題。隨著時間的推移,許多元素和屬性被添加到 HTML 中,直到後來 Web 社區集體意識到有更好的方法時才被刪除。由於已棄用和過時的元素和屬性已經存在於網路上,因此許多現代瀏覽器繼續支持它們的使用。儘管它們可能仍然有效,但您應該始終遵循最新版本的要求 HTML。不能保證瀏覽器對過時和棄用元素的支持會持續下去。有效但執行不 A 力。
有幾種 HTML 元素和屬性是有效的並且應該被使用,但是這些特性的實現隨著時間的推移而發生了變化,而 Web 開發社區的一些人還沒有註意到。HTMLtables 就是一個很好的例子。table 在某一時刻,使用 HTML 元素創建網頁佈局是很常見的。幾乎沒有人再這樣做了,CSS 比 tables 以往任何時候都更強大。但是,即使是經驗豐富的 Web 開發人員,也存在許多其他不太嚴重的誤用和語法錯誤。以下是一些經常被誤用得完全有效且有用的 HTML 功能以及正確實現的示例。
DOCTYPE
雖然在技術上不是 HTML 元素,但 DOCTYPE 聲明應該是每個 HTML 文檔中出現的第一件事。這個聲明是瀏覽器文檔中代碼的語言。過去,這個聲明包括幾個部分,可能會有點複雜。然而,在 HTML5 中,這很簡單:
使用該聲明開始每個人 HTML 文檔,Web 瀏覽器將準確地知道您要說什麼。
識別字元集
Web 瀏覽器必須知道用於編寫文檔的字元集才能正確呈現它。在絕大多數情況下,要聲明的正確字元集是 UTF-8。如果您需要聲明其他任何內容,很可能您已經知道並知道如何去做。如果您不確定,請堅持使用 UTF-8 是一個安全的選擇。在 HTML5 中聲明字元集比在以前的 HTML 版本中要簡單得多。這是現代 HTML5 中聲明的正確語法:
只需將該行放到 head 您的 HTML 文檔中即可。
鏈接到版權信息
過去,通常使用 meta 標簽來提供版權信息。但是,這不是處理此任務的正確方法,並且網路爬蟲無法識別標簽的這種標簽外使用 meta。識別版權的正確方法是使用 HTML 文檔 link 中的元素,如下所示:head
您還可以在錨點和區域元素上使用 rel="license" 屬性值對。
停止註釋掉腳本
在過去,通常使用如下語法將腳本添加到 HTML 文檔中:
這是有充分理由的。在某一時刻,許多瀏覽器無法識別 script 標簽,並試圖將標簽之間的內容呈現為 HTML,從而導致它們以純文本形式顯示腳本。為了避免這個問題,開發人員會註釋掉文本,這樣它就不會被不受支持的瀏覽器呈現為 HTML。那些日子已經離我們很遠了。所有現代瀏覽器都支持該 script 標簽。只需完全刪除 HTML 註釋括弧,或者更好的是,將 JavaScript 編寫在單獨的文件中,然後使用 script 標記將其導入到當前的 HTML 文檔中,如下所示:
立即停止使用的 HTML 元素
還有不少元素曾經是 HTML 規範的一部分,但後來被棄用或廢棄。以下是您可能仍在使用的八個 HTML 元素,您應該立即停止使用它們以及您可以使用的替代標簽:
- applet:如果您仍在使用此標簽,那麼您遇到的問題比使用不推薦使用的標簽更大,因為 Java 正在作為一種 Web 編程語言退出。短期內切換到 objectorembed 元素,但長期停止在 web 上使用 Java。
- bgsound: 這個元素曾經被 IE 用來為網站添加背景音樂。背景音樂從一開始就是個壞主意。只是不要這樣做。如果您想將音頻內容添加到您的網站,請使用 audio 標簽,但不要將其設置為自動播放。
- frame:該 frame 元素及其所有相關元素已從 HTML 規範中刪除。不要使用它們。如果 iframe 您嘗試嵌入外部網頁,請使用 CSS,如果您嘗試設計網站佈局,請使用。
- hgroup:在過去,您可以通過將標題和副標題包裝在適當的標題級別並將兩個標題包裝在 hgroup 標簽中來對標題和副標題進行分組。但是,此元素已被棄用。相反,使用單個標題元素來包含標題和副標題,將副標題包裝在 span 標簽中,並使用 CSS 來控制副標題的樣式。
- dir:目錄元素曾經是什麼 HTML 規範的一部分,用於表示文件或頁面的列表。改用錨元素的無序列表。
- acronym:此元素已被棄用,請改用縮寫標簽 abbr。
- isindex:此元素在網頁上創建了一個文本欄位。但是,從 HTML 4.01 開始,可以使用呈現此標記的 form 元素 input 和屬性來完成同樣的事情,type="text" 這些標記是不必要的和過時的。
- plaintext, xmp, 和 listing: 這些標簽是以純文本而不是 HTML 顯示文本的不同方式。如果您想在 HTML 文檔中嵌入純文本,您有兩個選項,pre 以及 'code'。要以等寬字體顯示文本並保留空格 use pre,要顯示代碼,請使用該 code 元素並 < 通過 > 鍵入 < 和 > 替換每個符號來轉義所有符號。
由 CSS 更好地處理的任務
有許多元素和屬性曾經是 HTML 的一部分,但執行的任務更適合 CSS。這些元素已經被棄用,取而代之的是讓 CSS 控制網頁呈現。
由 CSS 屬性替換的元素
曾經使用 HTML 元素(如 font、basefont、center、strike 和 u. 這些元素都已被棄用,取而代之的是 CSS 提供的字體和排版控制項。要瞭解更多信息,請查看我們的字體和網頁排版教程。一個從未真正流行起來的獨特標簽是 multicol。此標簽可用於將文本分成多列,類似於報紙的外觀。現在可以使用 CSScolumns 屬性在現代瀏覽器中創建類似但更強大的效果。
由 CSS 屬性替換的屬性
廣泛的 HTML 元素屬性曾經可用於控制 HTML 元素的呈現。幾乎所有這些標簽都已被棄用,現在 CSS 提供了相同的功能。如果您不熟悉 CSS 以及如何實現這些屬性,我們的 CSS 教程將幫助您立即開始使用層疊樣式表。下麵是一些更常用的屬性和現在可以用來實現相同結果的 CSS 屬性。
- align:此屬性已被強大的 CSS 屬性組合所取代,包括 text-align、float 和 vertical-align.
- background 和 bgcolor:不要使用這些已棄用的 HTML 屬性應用背景圖像和顏色,而是使用 background-image 和 background-colorCSS 屬性。
- height 和 width:這些屬性的使用在某些元素上仍然有效。但是,在所有情況下,都可以通過使用同名的 CSS 屬性來實現相同的效果。
- clear:如果要強制一個元素清除一側或兩側的所有其他元素,請使用 clearCSS 屬性而不是 clearHTML 屬性。
- border:雖然此屬性在許多元素上仍然可以正常工作,但使用 borderCSS 屬性應用邊框是更好的做法。
其他資源
在本文中,我們介紹了一些最常見的元素和屬性,這些元素和屬性使用不當或已被棄用或過時。然而,我們真的只是觸及了冰山一角。如果您想瞭解已從 HTML 規範中刪除的所有 HTML 元素和屬性,請參閱以下資源:
- 過時 HTML 功能的WHATWG 列表 https://developers.whatwg.org/obsolete.html
- 來自官方 HTML5 文檔的過時 HTML 功能 https://www.w3.org/TR/html5/obsolete.html