這些廢棄的HTML標簽不要用
HTML 已經(jīng)發(fā)展了多年,現(xiàn)在 W3C 已經(jīng)發(fā)布了 HTML 5.1 的提案推薦標準,一些陳舊廢棄的標簽已經(jīng)在后繼的標準中逐漸消失。這里為大家列出那些已經(jīng)被廢棄 HTML 標簽,看看你是不是還在使用它們。
<acronym>
首字母縮寫,例如 WWW
類似的有<abbr>標簽,表示單詞縮寫,例如 <abbr>inc.</abbr>。語法如下:
- <acronym title="World Wide Web">WWW</acronym>
- <abbr title="incorporated">inc.</abbr>
推薦用<abbr>,不要用<acronym>(忽略上面提到的語義上的差異)。
<applet>
Java 小應用程序,主要提供繪圖功能(在頁面上通過代碼繪制一些東西),例如:
- <applet code="ShowImage.class" width=600 height=400 archive="Imagetest.jar"></applet>
目前幾乎沒什么用了,因為運行需要 JRE,而目前主流瀏覽器并不默認安裝 JRE。
推薦使用<canvas>繪圖,或者用<object>+<embed>嵌入 flash代替<applet>。
注意:使用<object>+<embed>是為了更好的兼容性,如果場景允許,推薦使用<object>。
<basefont>
<basefont>標簽定義基準字體。該標簽可以為文檔中的所有文本定義默認字體顏色、字體大小和字體系列,例如:
- <basefont color="red" size="5" face="Arial" />
<basefont>標簽只有 IE 支持。
推薦直接給<body>元素定義默認字體,所有子元素都會繼承這些屬性值。
<bgsound>
用來添加背景音樂,例如:
- <bgsound src="your.mid" autostart="true" loop="infinite">
推薦使用<audio>或者<object>+<embed>來代替,例如:
- <embed src="your.mid" autostart="true" loop="true" hidden="true">
<big>
用來放大字體,放大一號(嵌套多層可以放大更多),不支持的瀏覽器顯示粗體,例如:
- <big>大1號</big><big><big>大2號</big></big>
至于“號”是怎么定義的就別管了,不推薦使用,建議根據(jù)語義采用<em>、<strong>或者自定義樣式類代替。
<blink>
可以實現(xiàn)閃爍效果,例如:
- <blink>Why would somebody use this?</blink>
支持性很差,不推薦使用,同樣不推薦使用(各大瀏覽器支持<blink>,但沒有任何效果):
- <p>This should be avoided as well.</p>
建議采用<animation>代替
<center>
使內(nèi)容居中,例如:
- <center>文本及子元素會居中</center>
效果類似于如下 CSS:
- text-align: center;
不建議使用,確實沒有任何理由去用。
<dir>
目錄列表,例如:
- <dir>
- <li>html</li>
- <li>xhtml</li>
- <li>css</li>
- </dir>
效果和<ul>基本相同,瀏覽器默認樣式下列表項的左邊距有細微差異。
不推薦使用,建議根據(jù)語義采用<ul>、<ol>或者<dl>。
<font>
用來定義字體、字號和顏色,例如:
- <font face="verdana" color="green" size="3">This is some text!</font>
屬性值和<basefont>一樣。
不推薦使用,建議用 CSS 代替,沒理由用這個標簽。
<frame>
配合<frameset>分欄,例如:
- <!DOCTYPE html>
- <html>
- <frameset cols="25%,*,25%">
- <frame src="frame_a.htm">
- <frame src="frame_b.htm">
- <frame src="frame_c.htm">
- </frameset>
- </html>
注意:用<frameset>替換掉<body>。
復雜的后臺頁面會用到<frameset>+<frame>布局,當然也可以采用 float/flex+Ajax 實現(xiàn),根據(jù)具體場景來定。
<frameset>
見<frame>。
<hgroup>
給一系列標題分組,例如:
- <hgroup>
- <h1>The reality dysfunction</h1>
- <h2>Space is not the only void</h2>
- </hgroup>
雖然提供了一點語義,但因為已經(jīng)過時,所以不推薦使用。
建議采用<header>代替,例如:
- <header>
- <h1>The reality dysfunction</h1>
- <p class="subheading">Space is not the only void</p>
- </header>
<isindex>
單行文本控件,初始顯示prompt屬性值,例如:
- <isindex prompt="string" />
目前支持性很差,不推薦使用,建議用<input>元素代替。
W3C 建議千萬不要用:
No, really, don’t use it. This element is deprecated. It is not implemented anymore.
具體用法可以參考 http://reference.sitepoint.com/html/isindex。
<listing>
不用管它是什么,微軟都不建議使用了:
This element is obsolete and should no longer be used. Use HTMLPreElement, code or CSS instead. Renders text in a fixed-width font.
<marquee>
滾動字幕,效果很強大,例如:
- <marquee bgcolor="#ccffff" vspace="10" direction="up" height="104" width="22.35%" loop="3" scrollamount="1" scrolldelay="10" hspace="20">
- <p align="center"><font color="#000000">此處輸入滾動內(nèi)容</font></p></marquee>
- <marquee>這里是輸入文字的地方,還可以放圖片代碼、Flash動畫代碼和gif動態(tài)小圖代碼。</marquee>
多用來實現(xiàn)公告,雖然已經(jīng)過時了,但效果確實很強大,而且支持性良好。
<multicol>
用來實現(xiàn)多列布局,不建議使用,任何主流瀏覽器都不曾支持過。
MDN 稱其從未被任何主流瀏覽器支持過:
The HTML element was an experimental element designed to allow multi-column layouts. It never got any significant traction and is not implemented in any major browsers.
<nextid>
作用未知,支持性未知,不建議使用。
<nobr>
禁止換行,例如:
- <p>Our telephone number is <nobr>0800 123 123 123</nobr>.</p>
不推薦使用,建議用 CSS 代替:
- white-space: nowrap;
<noembed>
在瀏覽器不支持<embed>時,顯示內(nèi)容,類似于<noscript>,例如:
- <noembed>
- <img src="/images/inflate.jpg" alt="Inflate the tyre by holding the
- pump at 90 degree angle to the valve">
- <p>You can inflate the tyre by holding the pump at 90 degree angle
- to the valve, as shown in the image above.</p>
- </noembed>
不推薦使用,如果需要考慮兼容性的話,建議采用<object>+<embed>+<noembed>(embed / noembed 作為 object 的回退)。
<noframes>
在瀏覽器不支持<frameset>+<frame>時,顯示內(nèi)容,類似于<noscript>,例如:
- <html>
- <frameset cols="25%,50%,25%">
- <frame src="frame_a.htm">
- <frame src="frame_b.htm">
- <frame src="frame_c.htm">
- <noframes>Sorry, your browser does not handle frames!</noframes>
- </frameset>
- </html>
<noframe>標簽中可以包含任何能夠出現(xiàn)在<body>中的標簽。
如果需要考慮兼容性的話,可以作為<frame>的回退,建議采用 float/flex + Ajax 實現(xiàn),根據(jù)具體場景來定。
<plaintext>
忽略內(nèi)容中的html標簽,作用類似于<pre>,例如:
- <p>The markup for this is:</p>
- <plaintext>
- <h1>Main heading goes here</h1>
- <p>First paragraph goes here</p>
- <h2>Sub-heading goes here</h2>
- </plaintext>.
- </body>
- </html>
不推薦使用,建議根據(jù)語義用<pre>或者<code>代替。
<spacer>
插入空白(white spaces),例如:
- <span>Just a text node</span>
- <spacer type="horizontal" size="10"></spacer>
- <span>Just another text node</span>
- <spacer type="block" width="10" height="10"></spacer>
主流瀏覽器都不支持,不推薦使用。
<strike>
刪除線,效果類似于<del>和<s>,例如:
- <p>Version 2.0 is <strike>not yet available!</strike> now available!</p>
不推薦使用,建議用<del>代替。
<tt>
鍵盤輸入(teletype),例如:
- <p><tt>Teletype text</tt></p>
不推薦使用,建議根據(jù)語義用<kbd>(鍵盤按鍵)、<var>(變量)、<code>(代碼)、<samp>(樣例輸出)或者CSS代替。
<xmp>
80 列的樣例輸出,樣式效果類似于<pre>,語義類似于<samp>,例如:
- <xmp>
- Stock ID Description Price Quantity in Stock
- -------- ----------- ----- -----------------
- 116 Inflatable Armchair 21.50 13
- 119 Walkie Talkie 40.20 44
- </xmp>
目前瀏覽器支持該標簽,但不限制 80 列。
不推薦使用,建議采用<samp>代替。