解決 IE 與 Firefox 等瀏覽器衝突 – CSS HACK

CSS Hack是當我們在網頁設計時，無論如何使用標準CSS，仍無法統一各瀏覽器，所採用的最後補救措施！但是CSS Hack有著許多的缺點，像是會讓CSS file多了許多累贅的描述，很多餘但是卻又必要…以及無法通過W3C驗證等等。 因此若是要使用CSS Hack來統一各瀏覽器之間的差異，務必要把他當成是網頁設計時最後的手段會比較好。

什麼是CSS Hack?

就是指利用不同瀏覽器的一些特殊屬性(非W3C標準)，來對不同瀏覽器進行設定，以達到前台視覺上統一的一種小技巧

使用時機：

當用盡了各種方法仍無法統一各瀏覽器之間的差異…

使用方法：

• 方法一：區別FF與IE系列，使用屬性：\9

  #csshack {
  margin-left: 30px;
  color:red; /* 設定為紅色 */
  color:blue\9; /* 再將IE系列(6,7,8)設為藍色 */
  }
  

\9 這個屬性只有IE系列能看的懂，利用CSS的特性：相同屬性後設定的會蓋掉之前設定的值。FF系列看不懂 color:red\9; 這個設定，會自動略過，而IE系列會將其套入。

• 方法二：區別 IE8 與 IE7 以下系列，使用屬性：*

  #csshack {
  margin-left: 30px;
  color:red; /* 設定為紅色 */
  *color:blue; /* IE7以下(6,7)設定為藍色 */
  }
  

*的這個屬性IE7以下系列能看的懂，使用這個屬性可以將IE8獨立出來而不會設定到。

• 方法三：針對IE6以下進行處理，使用屬性：_

  #csshack {
  margin-left: 30px;
  color:red; /*設定為紅色*/
  _color:blue; /*IE6以下的版本設定為藍色*/
  }
  

  _ 這個屬性只有在IE6以下的版本能看的懂，使用這個屬性可以將IE6獨立進行設定。

• 綜合使用：使FF, IE8, IE7, IE6都有獨立不同的設定

  #csshack {
  margin-left: 30px
  color:red; /* Firefox 設定為紅色 */
  color:orange\9; /* IE8 設定為橘色 */
  *color:black; /* IE7 設定為黑色 */
  _color:blue; /* IE6 設定為藍色 */
  }
  

　　再來就是利用這些特別的屬性以及網頁設計的經驗，來解決所碰上的各種bug囉。