Disabled the CSS

用 IE 的 DISABLED 性質選用串接樣式表

串接樣式表的差異處理: 會使用串接樣式表 (CSS) ，並且曾在 Internet Exploer 和 Netscape Navigator 兩大瀏覽器實作的人都知道，雖然 CSS 是 W3C 的通用規則，但在各瀏覽器廠商在規格實際表現上，還是有些出入的。雖然有些差異還在可容忍範圍，對一些內容取勝派網頁設計師來說，已經不會挑剔了，但對那些斤斤計較於版面位置大小必須精準的網頁設計師來說，可大大不以為然，他們寧願多花一倍的功夫，去為 IE 和 NS 各準備一份特別設計的串接樣式表 (CSS)，也不能稍稍放鬆一點任何在專業表現上的打折扣。

非用 Script 解決不可嗎？: 我們不在這裡談如何設定適合於 IE 和 NS 的 CSS ，也不談論花大把精力在精確的版面設計上是否值得，本文只談一個很簡單的小問題，如何依瀏覽器的不同而選用不同的串接樣式表。這個問題對早已熟悉 DHTML 的設計師來說或許覺得有些好笑，因為用 Script 依 navigator 物件資訊，來重導瀏覽者到適合瀏覽器的專屬網頁，或者選擇性的用 document.write() 方法來輸出不同的 LINK or STYLE 內容，早已是他們的家常便飯。但我這裡要提出的是真要那麼麻煩嗎？用單純的 HTML 配合 CSS 設定做不到嗎？

IE 的專用標籤性質 DISABLED: DISABLED 屬性的作用一句話可以解釋，那就是讓該標籤失去原有的作用。也不知道是微軟的那個程式設計師出的鬼主意，在 IE 4.0 以後為許多 HTML 標準標籤加上 DISABLED 的 attribute ，這個屬性在靜態 HTML 中絕對是多餘的，因為不能用的標籤幹嘛寫出來。但到了 DHTML 網頁可動態改變內容及顯示狀態後， DISABLED 可就有它好用的地方了，因為網頁設計師可在 Script 中去控制網頁標籤及其他元件是否有作用，從而避免瀏覽者錯誤動作的可能，並增加了 Script 控制的能力。不過這個標籤性質因為是 IE 獨家規格，所以除非瀏覽者使用 IE 4 以後版本的瀏覽器，這個屬性對其他瀏覽器來說是毫無作用的。

DISABLED 性質的真正作用

如果參考微軟瀏覽器官方網站說明文件 Workshop Reference 網頁，不管是 LINK 或 STYLE 這兩個 CSS 設定標籤，都有 DISABLED 性質。這個設計的本意，我想是微軟希望容許網頁設計師在一個網頁中同時引用好幾個樣式表，並可隨時動態決定那個樣式表開始對網頁樣式產生作用，而那個失去作用。所以 IE 在串接樣式設定上可以這樣做：

<!-- ......內部設定 Style Sheet...... // -->
<STYLE ID="第一樣式表 Name" TYPE="text/css">
    <!-- ...標籤樣式設定敘述... // -->
</STYLE>
<STYLE ID="預備樣式表 Name" TYPE="text/css" DISABLED>
    <!-- ...標籤樣式設定敘述... // -->
</STYLE>

<!-- ......外部聯結 Style Sheet...... // -->
<LINK REL="STYLESHEET" TYPE="text/css" href="外部樣式表檔案 URL"
    ID="第一樣式表 Name">
<LINK REL="STYLESHEET" TYPE="text/css" href="外部樣式表檔案 URL"
    ID="預備樣式表 Name" DISABLED>

不管樣式表是在網頁內設定，亦或聯結外部樣式表，這種寫法在 IE 裏面的用意，既不是準備一份有用的和一份無用的樣式表，也不是我們平常對串接樣式表的解釋，用後一份樣式表去補充修正前一份樣式表。IE 瀏覽器對此種語法真正的解釋是，同時載入兩份樣式表，先使用第一份樣式表，等某種設計者要求的情況產生時，再使用第二份樣式表。如果要求情況一直沒有產生，或設計者根本沒有設計要切換樣式表，那就只有第一份樣式表產生作用，而預備的樣式表就始終不會對網頁產生任何作用。

DISABLED 性質的歪用: 就如前段所言，DISABLED 是 IE 的專屬性質，NS 既不支援網頁載入後動態改變樣式，當然也就完全沒有使用 DISABLED 的理由，所以前段 IE 那種兩份樣式表，一 enabled ，一 disabled 的設計，到了 NS 瀏覽器，就被解釋成連續兩份樣式表都對網頁產生作用，並且後一樣式表補充修正前一樣式表。那如果後一樣式表把前一樣式表的所有樣式都修改變動過，那不就表示後樣式表取代了前樣式表嗎？所以就這樣歪打正著，產生了這種用靜態的 HTML 標籤，不靠任何 Script ，竟產生了 Cross Browser 的效果。

其他注意事項

或許依照本雜記慣例，你已經在等待按範例聯結了，但其實本說明頁就是範例，如果你現用的是 IE 或 NS 瀏覽器，就請你換另一種瀏覽器再來觀視本網頁，你會發覺本網頁完全換成另一種色彩顯示，至於 Style 設定，按檢視看原始網頁內容設定就是。最後要提醒你的是用這種方式為瀏覽器選擇 Style Sheet 要注意的是：

disabled 的必須是後一份 Style 設定，次序搞錯就 IE NS 用同一個 CSS了。
兩家瀏覽器共用的 Style 設定要放前一份，適用 NS 的放 disabled 的那一份。
本方式畢竟是種取巧捷徑，前提是 NS 不支援 Style 的 disabled 性質，萬一那天 NS 見賢思齊，也支援 disabled ，那這種設計就破功了。所以在你採用本方法之前，最好去函警告 NS 不准他的瀏覽器支援 disabled 性質，不過我懷疑 Netscape 研發人員會吃你這一套？

回前頁