今天要講的這個方法，不是什麼很高明的方法，但是很有效也很即時，尤其當你無法馬上寫出CSS常軌的解決之道的時候。首先要瞭解的是Conditional Comments這個東西，也就是「條件式註解」，「條件式註解」是IE專用的HTML註解語法，將原本用來作為註解的<!-- -->，加入它獨有的語法格式，使原本的註解變成對IE有效，但是對其他瀏覽器無效的語法。而這裡要告訴大家的是其中可用來當作CSS Hacks的小技巧，更多的Conditional Comments用法請參考MSDN：Microsoft Developer Network，很可惜的是台灣微軟尚未將這份文件完整中文化，不過至少你可以在網頁藝術思考這個Blog參考IE條件式註解的中文版說明。
接下來看看我們今天要介紹的語法範例：
<!--[if lte IE 6]>
<link href="ie6fix.css" rel="stylesheet" type="text/css" />
<![endif]-->[if lte IE6]的lte意思是lower than or equal to，指某一版本以及比它更舊的版本，也就是說在這裡指的是內容只有IE6及其較舊的版本才會顯現，而我們利用CSS的優先順序特性之一，最後設定的樣式將蓋過之前設定的樣式，讓它取代原本的CSS樣式表設定，於是一個有效的完整範例可能會是這樣：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>This is a sample title</title>
<link href="stylesheet.css" rel="stylesheet" type="text/css" />
<!--[if lte IE 6]>
<link href="ie6fix.css" rel="stylesheet" type="text/css" />
<![endif]-->stylesheet.css是我們原本要使用的CSS外部樣式表檔案，而ie6fix.css則是針對IE6或更舊的IE所編寫的額外樣式表檔案，你可以在這個檔案裡面只編寫支援度有問題的屬性。
同樣的，你也可以加上有關IE7的設定：
<!--[if lte IE 6]>
<link href="ie6fix.css" rel="stylesheet" type="text/css" />
<![endif]-->
<!--[if IE 7]>
<link href="ie7.css" rel="stylesheet" type="text/css" />
<![endif]-->題外話，我幾個禮拜前到了某一家國內前幾大的網路公司，做了一個簡單的Interview，其中令我印象深刻的是，中途參與的一位專案經理，詢問我有關我自己CSS排版的速度，因為他們的客戶會要求使用CSS排版，我表示會比使用表格(Table)要來的慢一些，他顯然不可置信，頻頻表示，如果CSS上手的話，會比用Table快的多，何況以他們公司龐大的專案，常常要一次處理幾千頁的網站，而且現在外面都沒有人在使用Table了，除了EDM。這些話乍看之下很有道理，要知道，在Jeffrey Zeldman所撰寫的《跨平台網頁設計 Designing with web standards》中提到：站在實務的立場，認為在合理範圍內仍舊可以使用表格技術，而在本書Chapter 2提到的過渡性方法，即是以XHTML的表格提供基本的版面配置並搭配CSS取代過時的字型等外觀元素標記，也就是說在這裡表格本身只是一個用來處理CSS的容器，再說有80%以上的支援性問題，可能都來自從表格轉換到純粹CSS排版的問題上，所以才會有一個名為/* Position Is Everything */的網站，專門來解決排版上的問題。而一個經過思考，簡單而不繁複(過去Table最為被詬病的問題之一，Table包Table)的Table框架搭配div去排版，僅管不合時宜，但是開發時間仍舊是完全CSS排版無法完全取代的，跨瀏覽器的支援性上也可以說是沒有問題，除了網站無障礙以外。我左思右想，大概也只有從過去該公司不少只支援IE的作品中，找出這句話端倪，如果不考慮瀏覽器的支援性，大概不管用什麼排版速度都可以很快。
在我的觀點來說，支援度是優先考量，而手段是其次，既然一個客戶跟你要求的是CSS，背後的意義顯然應該是希望能夠做到跨平台支援度，而非只是字面上的CSS三個字，當你使用了CSS，卻只支援某一個瀏覽器，那麼要求CSS就變成僅是一個表面工夫罷了，這不是本末倒置嗎？
對了，幾千頁的網站，到底是什麼呢？
發表文章
1 意見:
I can't agree more! No matter how beautiful a website is design, it's people who visit that matter. Either a website was designed for only a limited group of people to read, or a state-of-the-art website design with no visitor is practically meaningless.
Usability (including compatibility) should always come first!
Kelvin
Search Marketing Journal | SourceSquare
張貼留言