巧妙的利用XHTML中不常用的標籤元素

仲介交易 HTTP://www.aliyun.com/zixun/aggregation/6858.html">SEO診斷 淘寶客 雲主機 技術大廳

玩XHTML的朋友對div,span,ul,li這樣的標籤元素相信已經非常熟練了，但有時一個頁面裡需要對一些特別的文字做一些特別的渲染，我們常用的做法可能是在CSS裡定義一個類選擇符，定義一些特別的渲染效果，然後用 <span class="類名">XXX</span>這樣的方法來達到效果，當然是可以的，但才子在這裡要介紹另外一種方法，那就是利用一些我們不常用的標籤來達到效果。

其實XHTML裡還有許多我們並不常用的標籤元素，並不是W3C建議放棄使用的標籤，而且很短，我們可以好好利用一下。

例如q標籤，em標籤等等，q標籤原本是用來分離引語的，而em標籤原本就是表示強調文本的。 例如：
<p>我說：<q>「好呀！ 」</q></p>
<p>我們都是<em>優秀的程式師</em></p>

　　但我們實際應用中，幾乎沒人這樣用，這麼好的短標籤浪費了多可惜，嘿嘿。 我們來好好利用一下。 例如我們把這個q標籤改成加粗的字體，把em標籤改成紅色加粗的字體，這兩個標籤以後就當成我們頁面中的引起使用者注意的強調關鍵字來用。 怎麼做呢?相信大家都想到了，直接在CSS裡定義兩個標籤選擇符嘛。 對，沒錯。 如下：
       q {font-weight:bold;}
       em {color:red;font-style:normal;font-weight:bold;}

      有人會問em標籤裡幹嘛加個font-style:normal;呢？ 這是因為預設的em標籤的字體是斜體字，所以我們把它改成標準字型。
以後我們應用時就這樣：

     <p>才子喜歡玩<q>XHTML</q>，對網站的<em>前臺開發</ em>頗有興趣，歡迎大家有空來逛逛<em><a href="HTTP://www.54caizi.org"title="才子小窩">才子小窩</a></em></ p>

     這樣一來，我們代碼也顯得更簡潔了，代碼也變得更短了，何樂而不為呢？ XHTML裡還有很多這類型的標籤，主要都是些文字標籤，都不常用，才子在這裡還推薦幾個：

dfn標籤，原本用於表明術語的定義實例，如：<dfn>HTML 代表超文字標記語言。 </dfn>
cite標籤，原本用於標明引言，如：<cite title="HTTP://www.54caizi.org">才子小窩</cite>
var標籤，原本用於定義程式設計變數，如：變數<var>i</var>代表迴圈次數
kbd標籤，原本用於表明消費者輸入的文字，如：請輸入<kbd title="請輸入QUIT退出">QUIT</kbd>退出。
samp標籤，原本用於指定代碼範例，如：程式的輸出是<samp>x+y</samp>。
acronym標籤，原本用於單詞的縮寫介紹，如：<acronym title="Cascading Style Sheets">CSS</acronym>
abbr標籤，原本是單詞簡稱的介紹標籤，但IE6不支援，暈。 如：<abbr title="Limited">Ltd.</abbr>

當然還有一些，在這裡不一一列舉了，以上這些標籤除了abbr標籤IE6不支援以外，其它的標籤在任何主流瀏覽器上全部有效，我們都可以用來做一些特殊的效果渲染，至於要做成什麼樣子，那就要看各位的想像力了，嘿嘿。

風流才子 作品，轉帖請保留原文位址連結，謝謝合作! 才子小窩：HTTP://www.54caizi.org