既然HTML中定義了這么多標(biāo)簽，而且每種標(biāo)簽都有其用法，我們?yōu)槭裁床槐M量去使用這些標(biāo)簽?zāi)。下面收集并整理?6個(gè)常被我們遺忘卻非常有用的HTML標(biāo)簽。
1. <!? ?> :注釋
2. <!DOCTYPE>：文檔類型聲明
文檔類型，會(huì)使瀏覽器使用相應(yīng)的方式加載網(wǎng)頁并顯示，忽略DTDs，將使網(wǎng)頁進(jìn)入一種混亂模式(quirks mode)。
示例：
XHTML過渡定義類型，此類型可以使用HTML4中的標(biāo)簽
<!DOCTYPE html PUBPC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
XHTML嚴(yán)格定義類型，此文檔只可以使用XHTML1中定義的標(biāo)簽
<!DOCTYPE html PUBPC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
XHTML1.1版定義類型
<!DOCTYPE html PUBPC “-//W3C//DTD XHTML 1.1//EN” “http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd”>
XHTML框架定義類型。(可以使用框架)
<!DOCTYPE html PUBPC “-//W3C//DTD XHTML 1.0 Frameset//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd”>
3. <abbr>：縮寫
示例：<abbr title=”Pmited”>Ltd.</abbr>
說明：簡(jiǎn)稱和縮寫是對(duì)一個(gè)慣用詞組的縮寫表示，一般使用詞組中每個(gè)單詞的首字母，比如CSS(Cascading Style Sheets),而HTML(Hypertext Markup Language)就不是一種提取首字母的縮寫.有時(shí)候縮寫經(jīng)常會(huì)在最后加一個(gè)。
4. <acronym>： 取首字母的縮寫
示例：<acronym title=”Cascading Style Sheets”>CSS</acronym>
5. <area>： 定義圖像點(diǎn)擊區(qū)域
area標(biāo)簽是單獨(dú)出現(xiàn)的，<area />
area標(biāo)簽必須使用在map標(biāo)簽中，而且必須配合img標(biāo)簽使用。
屬性：
Common ― 一般屬性
accesskey ― 鏈接的快捷鍵訪問方式
alt ― 圖像的提示文字
coords ― 定義可點(diǎn)擊區(qū)域圖形的坐標(biāo)
href ― HTML鏈接源的URL
nohref ― 圖像點(diǎn)擊排除的區(qū)域，當(dāng)不使用href時(shí)應(yīng)使用nohref
shape ― 可點(diǎn)擊區(qū)域的形狀
tabindex ― 使用”Tab”鍵的遍歷順序
target ― 鏈接目標(biāo)
area是cPent-side image map area的意思，區(qū)域
area標(biāo)簽示例：
<img src=”http://www.renniaofei.com/images/logo.png” usemap=”#Map” /> <map name=”Map” id=”Map”> <area shape=”rect” coords=”35,29,135,99″ href=”#” /> <area shape=”circle” coords=”243,78,44″ href=”#” /> <area shape=”poly” coords=”120,137,195,154,135,207″ href=”#” /> </map>
6. <base>: 定義基URL用于頁面的鏈接與引用
base標(biāo)簽是單獨(dú)出現(xiàn)的，<base />
base標(biāo)簽只能放置在head標(biāo)簽內(nèi)
當(dāng)使用相對(duì)路徑定義鏈接時(shí)，可以使用base標(biāo)簽定義基URL解析所有文檔中定義的相對(duì)路徑的URL
屬性：
href ― 基URL
target ― 鏈接目標(biāo)
base是document base URI的意思
base標(biāo)簽示例
<head> <base href=”http://www.renniaofei.com/” target=”_blank”> </head>
使用上面示例代碼的html頁面中的相對(duì)鏈接，將直接指向基URL http://www.renniaofei.com/，并且使用彈出窗口。
base標(biāo)簽在框架中的使用
base標(biāo)簽通？梢允褂迷诳蚣苕溄又，例如
<frameset cols=”20%, *”> <frame src=”Pst.html”> <frame src=”http://www.renniaofei.com/” name=”mainTarget”> < /frameset>
鏈接頁P(yáng)st.htm
l<head> <base target=”mainTarget”> </head> < a href=”http://www.renniaofei.com/category/design/”>design</a> < a href=”http://www.renniaofei.com/category/graphic/”>graphic</a> <a href=”http://www.renniaofei.com/category/inspiration/”>inspiration</a> <a href=”http://www.renniaofei.com/category/freebies/”>freebies</a>
通過上面示例可以避免在每個(gè)鏈接中寫入target=”mainTarget”
7. <blockquote>：表示引用塊
blockquote標(biāo)簽是成對(duì)出現(xiàn)的，以<blockquote>開始，以</blockquote>結(jié)束
屬性：
Common ― 一般屬性
cite ― 被引用內(nèi)容的URI
示例：
<blockquote cite=”http://www.renniaofei.com/xhtml/”> <p>標(biāo)準(zhǔn)網(wǎng)頁設(shè)計(jì)要區(qū)分內(nèi)容與表現(xiàn)，學(xué)習(xí)標(biāo)準(zhǔn)網(wǎng)頁設(shè)計(jì)。</p> </blockquote>
8. <button> ：定義按鈕
button標(biāo)簽是成對(duì)出現(xiàn)的，以<button>開始，</button>結(jié)束
可以定義比input內(nèi)容更豐富的按鈕。
屬性：
Common ― 一般屬性
accesskey ― 快捷鍵訪問方式
disabled ― 禁止使用
name ― 標(biāo)簽名稱
tabindex ― 使用”Tab”鍵的遍歷順序
type ― 按鈕類型
button ― 普通按鈕
reset ― 重置表單按鈕
submit ― 提交按鈕
value ― 通過表單傳遞到服務(wù)器端的數(shù)據(jù)
button是push button的意思，按鈕
button標(biāo)簽示例：
<button type=”submit”>提交</button>
一個(gè)使用文字的普通的提交按鈕
<button type=”reset”> 從<strong>任鳥飛</strong>提交表單 </button>
改變按鈕內(nèi)加重文字的button標(biāo)簽
<button type=”button”> <img src=”renniaofei.png” alt=”提交” /></button>
說明：使用圖片的button標(biāo)簽，注意有alt的提示文字。
9. <caption>：HTML表格的標(biāo)題
caption標(biāo)簽是成對(duì)出現(xiàn)的，以<caption>開始。</caption>結(jié)束
屬性：
Common ― 一般屬性
caption:標(biāo)題
示例：
<table width=”80%”> <caption> 域名數(shù)量介紹 < /caption> <tr> < th>www.renniaofei.com</th> < th>.com域名的數(shù)量</th> <th>.cn域名的數(shù)量</th> < th>.net域名的數(shù)量</th> </tr> <tr> < td>2003年</td> <td>1000</td> < td>2000</td> <td>3000</td> </tr> < tr> <td>2004年</td> <td>4000</td> <td>5000</td> <td>6000</td> </tr> < tr> <td>2005年</td> <td>7000</td> <td>8000</td> <td>9000</td> </tr> < /table>
說明：
caption標(biāo)簽可以為表格提供一個(gè)描述，和圖像的說明alt比較類似.默認(rèn)情況下，瀏覽器顯示表格標(biāo)題在表格的上方。
CSS里的caption-side屬性用來控制表格標(biāo)題顯示的位置。
10. <cite>引用
cite標(biāo)簽是成對(duì)出現(xiàn)的，以<cite>開始，以</cite>結(jié)束
屬性：
Common ― 一般屬性
cite ― 引用內(nèi)容的URI
cite是citation的縮寫
示例：
<cite cite=”http://www.renniaofei.com/”>一步步的教我學(xué)會(huì)HTML與XHTML</cite>
11. <col> 可以對(duì)HTML表格結(jié)構(gòu)化分區(qū)后的一個(gè)或幾個(gè)區(qū)域使用同樣的樣式行
col標(biāo)簽是單獨(dú)出現(xiàn)的，<col />
屬性：
Common ― 一般屬性
span ― 定義一個(gè)col跨越的列數(shù),默認(rèn)值為1
12. <colgroup>表示對(duì)HTML表格進(jìn)行結(jié)構(gòu)化的分區(qū),在此分區(qū)中可以通過使用col定義每列表格的樣式
colgroup標(biāo)簽是成對(duì)出現(xiàn)的，以<colgroup>開始，以</colgroup>結(jié)束
屬性：
Common ― 一般屬性
span ― 定義一個(gè)colgroup跨越的列數(shù),默認(rèn)值為1
13. <dd>代表HTML自定義列表描述
dd標(biāo)簽是成對(duì)出現(xiàn)的，,以<dd>開始，</dd>結(jié)束
屬性：
Common ― 一般屬性
dd是definition description的縮寫
14. del 標(biāo)簽 ― 定義被刪除的文本
del標(biāo)簽是成對(duì)出現(xiàn)的,以<del>開始，</del>結(jié)束
del通常應(yīng)連同ins標(biāo)簽一同使用，表示被刪除與被插入的文本
通過del與ins定義文檔可以幫助了解文檔內(nèi)容的修改過程，利于多人編輯系統(tǒng)
使用del定義的文本通常帶有刪除線
屬性：
Common ― 一般屬性
cite ― 引用網(wǎng)址，定義為何刪除的引用網(wǎng)址
datetime ― 刪除的時(shí)間與日期
title ― 定義刪除的目的或提示
del是deleted text的縮寫，刪除文本
del標(biāo)簽示例：
<p>任鳥飛網(wǎng)頁設(shè)計(jì)網(wǎng)址 <del title=”del url” cite=”http://www.renniaofei.com/”> http://www.renniaofei.com/ < /del> <ins>http://www.renniaofei.com/</ins> ，原先 <del>http://www.renniaofei.com/</del> 網(wǎng)址已經(jīng)刪除。 </p>
15. <dir> 定義多層目錄列表
不符合標(biāo)準(zhǔn)網(wǎng)頁設(shè)計(jì)的理念，不贊成使用.
dir標(biāo)簽是成對(duì)出現(xiàn)的，以<dir>開始，</dir>結(jié)束
屬性：
Common ― 一般屬性
dir是directory Psts的縮寫，目錄列表
16. <dfn> ? 定義標(biāo)簽
dfn標(biāo)簽是成對(duì)出現(xiàn)的，以<dfn>開始，以</dfn>結(jié)束
屬性：
Common ― 一般屬性
dfn是defining instance的縮寫
示例： <dfn>任鳥飛</dfn>網(wǎng)頁設(shè)計(jì)網(wǎng)!
17. <dl> 代表HTML自定義列表
dl標(biāo)簽是成對(duì)出現(xiàn)的，以<dl>開始，</dl>結(jié)束
自定義列表的開始使用<dl>標(biāo)簽，列表中每個(gè)元素的標(biāo)題使用<dt>(definition term)定義，后面跟隨<dd>(definition description)用于描述列表中元素的內(nèi)容.
屬性：
Common ― 一般屬性
dl是definition Psts的英文縮寫
示例：
<dl> <dt>www</dt> <dd>World Wide Web的縮寫.</dd> <dt>renniaofei</dt> < dd>任鳥飛</dd> <dd>www的:).</dd> < dt>com</dt> <dt>com.cn</dt> < dt>cn</dt> <dd>這都是域名的后綴.</dd> </dl>
說明：
不一定每個(gè)dt標(biāo)簽要對(duì)應(yīng)一個(gè)dd，可以一對(duì)多或多對(duì)一(就像上面的例子)
18. <dt>代表HTML自定義列表組
dt標(biāo)簽是成對(duì)出現(xiàn)的，以<dt>開始，</dt>結(jié)束
屬性：
Common ― 一般屬性
dt是definition term的縮寫
19. <em> 強(qiáng)調(diào)標(biāo)簽
em標(biāo)簽是成對(duì)出現(xiàn)的，以<em>開始，以</em>結(jié)束
屬性：
Common ― 一般屬性
em是emphasis的縮寫
示例： 強(qiáng)調(diào)一下,<em>不要</em>和我開玩笑!
20. <ins> 定義被插入的文本
ins標(biāo)簽是成對(duì)出現(xiàn)的，以<ins>開始，</ins>結(jié)束
ins通常應(yīng)連同del標(biāo)簽一同使用，表示被插入與被刪除的文本
通過ins與del定義文檔可以幫助了解文檔內(nèi)容的修改過程，利于多人編輯系統(tǒng)
使用ins定義的文本通常帶有下劃線
屬性：
Common ― 一般屬性
cite ― 引用網(wǎng)址，定義為何插入的引用網(wǎng)址
datetime ― 插入的時(shí)間與日期
title ― 定義插入的目的或提示
ins是inserted text的縮寫，插入文本
ins標(biāo)簽示例：
<p>任鳥飛網(wǎng)頁設(shè)計(jì)網(wǎng)址 <del title=”del url” cite=”http://www.renniaofei.com/”> http://www.renniaofei.com/ < /del> <ins>http://www.renniaofei.com/</ins> ，原先 <del>http://www.renniaofei.com/</del> 網(wǎng)址已經(jīng)刪除。 </p>
21. <kbd>標(biāo)簽表明使用者輸入的文字
kbd標(biāo)簽是成對(duì)出現(xiàn)的，以<kbd>開始，以</kbd>結(jié)束
屬性:
Common ― 一般屬性
示例： To exit, type <kbd>QUIT</kbd>.
22. <map>定義圖像點(diǎn)擊區(qū)域的集合
map標(biāo)簽是成對(duì)出現(xiàn)的,以<map>開始，</map>結(jié)束
map標(biāo)簽必須配合area標(biāo)簽使用
map標(biāo)簽中name與id屬性指定的值必須與定義圖像點(diǎn)擊區(qū)中圖像(img)的usemap屬性指定的值一致
屬性
Common ― 一般屬性
id ― 定義map的名稱。
name ― 定義map的名稱。
map是cPent-side image map的意思
map標(biāo)簽示例：
<img src=”http://www.renniaofei.com/images/logo.png” usemap=”#Map” /> <map name=”Map” id=”Map”> <area shape=”rect” coords=”35,29,135,99″ href=”#” /> <area shape=”circle” coords=”243,78,44″ href=”#” /> <area shape=”poly” coords=”120,137,195,154,135,207″ href=”#” /> </map>
23. <menu> 定義菜單列表
不符合標(biāo)準(zhǔn)網(wǎng)頁設(shè)計(jì)的理念，不贊成使用。
menu標(biāo)簽是成對(duì)出現(xiàn)的,以<menu>開始，</menu>結(jié)束
屬性
Common ― 一般屬性
menu:菜單
24. <noframes>對(duì)不支持框架的設(shè)備進(jìn)行提示
noframes標(biāo)簽是成對(duì)出現(xiàn)的，以<noframes>開始，</noframes>結(jié)束
由于frameset內(nèi)不能包含body標(biāo)簽，因此noframes內(nèi)部必須包含body標(biāo)簽
示例
<frameset cols=”50%,25%,25%”> <frame src=”http://www.renniaofei.com/category/design/”> <frame src=”http://www.renniaofei.com/graphics/”> <frame src=”http://www.renniaofei.com/inspiration/”> <noframes> <body> < p>任鳥飛網(wǎng)頁設(shè)計(jì)網(wǎng)使用了框架技術(shù)，但是您的瀏覽器不支持框架，請(qǐng)升級(jí)您的瀏覽器以便正常訪問。</p> < /body> </noframes> </frameset>
25. <noscript>無法加載腳本時(shí)的提示文字
noscript標(biāo)簽是成對(duì)出現(xiàn)的，以<noscript>開始,以</noscript>結(jié)束
示例
<noscript>此頁面無法加載js腳本代碼。</noscript>
26. <q>
表示一個(gè)行引用
q標(biāo)簽是成對(duì)出現(xiàn)的，以<q>開始，以</q>結(jié)束。
屬性:
Common ― 一般屬性
cite ― 引用內(nèi)容的URI
q是quoted text的縮寫
示例：
<cite>古人</cite>云：<q>良言一句三冬暖，惡語傷人六月寒。</q>
27. <s>定義刪除線的文字
不符合標(biāo)準(zhǔn)網(wǎng)頁設(shè)計(jì)的理念，不贊成使用。
s標(biāo)簽是成對(duì)出現(xiàn)的，以<s>開始，以</s>結(jié)束
屬性：
Common ― 一般屬性
s是strikethrough的縮寫
28. <sub>表示下標(biāo)
sub標(biāo)簽是成對(duì)出現(xiàn)的，以<sub>開始。以</sub>結(jié)束
屬性：
Common ― 一般屬性
sub是subscript的縮寫
29. <sup>表示上標(biāo)
sup標(biāo)簽是成對(duì)出現(xiàn)的，以<sup>開始，以</sup>結(jié)束
屬性：
Common ― 一般屬性
sup是superscript的縮寫
30. <tbody> 表示HTML表體
瀏覽器顯示表格時(shí)，通常是完全下載表格后，再全部顯示，所以當(dāng)表格很長(zhǎng)時(shí),可以使用tbody分段顯示。
31. <tfoot>表示HTML表腳
表格的表腳tfoot，可以使用單獨(dú)的樣式定義表腳，并且在打印時(shí)可以在分頁的下部打印表腳。
32. <th>代表HTML表格中的表頭
th標(biāo)簽是成對(duì)出現(xiàn)的,以<th>開始，</th>結(jié)束
屬性：
Common ― 一般屬性
abbr ― 代表表頭的簡(jiǎn)寫
axis ― 對(duì)單元格在概念上分類
colspan ― 一行跨越多列
headers ― 連接表格的數(shù)據(jù)與表頭
rowspan ― 一列跨越多行
scope ― 定義行或列的表頭
aPgn ― 代表水平對(duì)齊方式(left(左對(duì)齊) | center(居中對(duì)齊) | right(右對(duì)齊) | justify)(此屬性應(yīng)該使用CSS實(shí)現(xiàn))
vaPgn ― 代表垂直對(duì)齊方式(top(頂部對(duì)齊) | middle(中部對(duì)齊) | bottom(下部對(duì)齊) | basePne(基線對(duì)齊))(此屬性應(yīng)該使用CSS實(shí)現(xiàn))
th是table header cell的縮寫
示例：
<table width=”80%” border=”1″> <tr> < th>www.renniaofei.com</th> < th>.com域名的數(shù)量</th> <th>.cn域名的數(shù)量</th> < th>.net域名的數(shù)量</th> </tr> <tr> < th>2003年</th> <td>1000</td> < td>2000</td> <td>3000</td> </tr> < tr> <th>2004年</th> <td>4000</td> <td>5000</td> <td>6000</td> </tr> < tr> <th>2005年</th> <td>7000</td> <td>8000</td> <td>9000</td> </tr> < /table>
33. <thead>表示HTML表頭
表格的頭部thead，可以使用單獨(dú)的樣式定義表頭，并且在打印時(shí)可以在分頁的上部打印表頭
34. l 標(biāo)簽 ― 表示一段語句
l標(biāo)簽是成對(duì)出現(xiàn)的，以<l>開始,以</l>結(jié)束
屬性：
Common ― 一般屬性
l是Pne of text的縮寫
示例： <l>一行實(shí)實(shí)在在的文字!</l>
35. <Code>代碼標(biāo)簽
code標(biāo)簽是成對(duì)出現(xiàn)的，以<code>開始，以</code>結(jié)束，常用于顯示源代碼。
36. <fieldset> 表單分組
如果一個(gè)頁面的表單項(xiàng)太多，我們最好把它們分組顯示，就像使用p標(biāo)簽分開段落一樣，可以使用fieldset與legend標(biāo)簽對(duì)表單內(nèi)容分組。
fieldset標(biāo)簽是成對(duì)出現(xiàn)的，以<fieldset>開始，以</fieldset>結(jié)束
一個(gè)表單可以有多個(gè)<fieldset>，每對(duì)<fieldset>為一組，每組內(nèi)容的描述可以使用legend標(biāo)簽說明
示例：
<fieldset> <legend>我最喜愛的：</legend> <label for=”computer”>計(jì)算機(jī)</label> <input type=”checkbox” value=”1″ id=”fav” name=”fav” /> <label for=”trval”>旅游</label> <input type=”checkbox” value=”2″ id=”fav” name=”fav” /> <label for=”buy”>購物</label> < input type=”checkbox” value=”3″ id=”fav” name=”fav” /> < /fieldset>
]]>保持良好的代碼風(fēng)格是每個(gè)Coder必學(xué)的課程,同樣在HTML設(shè)計(jì)的時(shí)候也要特別注意代碼的規(guī)范性,雖然說不規(guī)范的代碼不會(huì)直接造成嚴(yán)重的后果,但很有可能對(duì)用戶體驗(yàn)造成一定的干擾,同時(shí)也會(huì)降低搜索引擎對(duì)網(wǎng)站的好感度.這份列表包含了10個(gè)最容易犯的HTML標(biāo)簽錯(cuò)誤,記下他們,能夠讓我們避免犯此常見錯(cuò)誤,讓我們的HTML標(biāo)簽符合語義,和標(biāo)準(zhǔn)的要求.
罪行1:把塊級(jí)元素放入了行內(nèi)元素內(nèi)
HTML 元素的表現(xiàn)方式不外乎就兩種:塊級(jí)和行內(nèi).每一個(gè)標(biāo)簽都有默認(rèn)的表現(xiàn)方式不是塊級(jí)就是行內(nèi).像P和p 就是塊級(jí)元素,他們用來形成文檔結(jié)構(gòu).行內(nèi)元素只能在快級(jí)元素內(nèi).
罪行2: img 標(biāo)簽沒有包含alt屬性
alt屬性是所有顯示在網(wǎng)頁中圖片的必須屬性,它能夠幫助人們知道這是什么圖片.或者在網(wǎng)速比較慢的時(shí)候顯示圖片的含義是什么.它的主要目的是,說 明圖片的含義,想這樣的說明 alt=”image”是很糟糕的.如果,有些圖片的確只是裝飾作用而已,那么建議你寫成 alt=””.
罪行3:在必要的時(shí)候沒使用list
犯罪4：使用<b>和<i>顯示黑體字和斜體
可以用css樣式定義 font-weight 和 font-style. 如果必須在頁面中寫標(biāo)簽的話,用 <strong> 或 <em>標(biāo)簽來替換.<b><i>的沒有任何語義可言, 但是,為了更簡(jiǎn)潔的頁面,還是選擇 css定義樣式吧
犯罪5：使用太多<br/>
<br />換行標(biāo)記只應(yīng)該用于插入是在第一個(gè)文本流換行符敲到一個(gè)新行一個(gè)特別字了。它不應(yīng)該被用來制造元素之間的差距，而是分裂成不同的段落，或調(diào)整的幅度CSS樣式的文本。
罪行6: 使用錯(cuò)誤的 Strikethrough 標(biāo)簽
在昔日，<S>和<strike>允許用來定義網(wǎng)站文字。不過，現(xiàn)在他們被定義為不推薦使用的標(biāo)簽,當(dāng)他們?nèi)稳豢梢杂行Ч?現(xiàn)在用新的標(biāo)記集- <del>和<ins>。來替換<s><strike>
罪行 7: 使用內(nèi)聯(lián)樣式
css最重要的目的只是為了區(qū)分文檔和樣式,如果,你把style寫到頁面里面,那么完全沒有css的作用可言.所以,記住把你的樣式放在它該放的位子
罪行 8: 把border添加到HTML中
罪行 9: 沒有使用header標(biāo)簽<h1>-<h6>
罪行10: 沒有語義的 <blink> 或<marquee>
不被w3推薦，<blink>和<marquee> (閃動(dòng),滾動(dòng))標(biāo)簽是純粹的丑陋。
不要使用這個(gè)標(biāo)簽,如果一定要用這樣的效果,相信,你會(huì)有其他更好的效果
]]>
今天來認(rèn)識(shí)一下兩個(gè)我不太常用到的html標(biāo)簽：sub標(biāo)記和sup標(biāo)記。
定義和用法:
<sub> 標(biāo)簽可定義下標(biāo)文本。<sup> 可定義上標(biāo)文本。都屬于行內(nèi)元素，默認(rèn)比當(dāng)前字體稍小。
例子:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ />
<title>html中的sub與sup標(biāo)簽</title>
<style type=”text/css”>
* { font-size:12px; font-family:Tahoma}
</style>
</head>
<body>
<div>
這個(gè)標(biāo)簽是<sub>sub</sub>
這個(gè)標(biāo)簽是<sup>sup</sup>
</div>
</body>
</html>
舉一反三：
我們來看看數(shù)學(xué)方程式這種效果怎么實(shí)現(xiàn)？
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ />
<title>html中的sub與sup標(biāo)簽</title>
<style type=”text/css”>
* { font-size:12px; font-family:Tahoma}
</style>
</head>
<body>
<div>
x<sub>1</sub>+y<sub>2</sub><sup>3</sup>=15
</div>
</body>
</html>
其他應(yīng)用：
偶然的機(jī)會(huì)，發(fā)現(xiàn)前段時(shí)間的淘寶網(wǎng)在價(jià)格上做了點(diǎn)修飾(不知道什么原因，現(xiàn)在又復(fù)原了)，和以前傳統(tǒng)的價(jià)格表現(xiàn)不一樣。
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ />
<title>html中的sub與sup標(biāo)簽</title>>
</head>
<style type=”text/css”>
<!–
body { font:12px/1.8 Tahoma}
span.price { font-family:Arial, Helvetica, sans-serif; font-size:16px; font-weight:700; color:red;}
span.price sub { vertical-align:baseline; font-size:12px;}
span.price sup { vertical-align:text-bottom; color:#555}
–>
</style>
<body>
<span class=”price”><sup>￥</sup>43.<sub>26</sub></span>
</body>
</html>
相信sub和sup標(biāo)簽的應(yīng)用不止局限于此，其他html標(biāo)簽也如此，只要你了解了它們，發(fā)動(dòng)我們的思維和想象，就可以熟練的運(yùn)用它們、展現(xiàn)它們獨(dú)特魅力的一面。