close

網路上實在是太多假資料了…趁有記憶時寫一下好了

首先先推薦一下這個 :IE detctor  這大概是我目前看到最完整的css 版IE 測試器了

http://www.fantxi.com/demo/html/browser_detector.html

(用法:直接view source)

 

簡單說: 分為

為了IE的CSS真的很麻煩…居然還有針對IE8 Beta,還有IE simulator的寫法:

 

1: IE6 only

2: IE7 only

3: IE6.7 only

4: IE8以上support

5: IE 8 only  (記錄上次的bug)

 

都還滿簡單的:

最麻煩的是當你只要給IE8,但你不要給IE9的CSS

 

因為沒有特別為它寫一個: 所以要用很特別很特別的hack方法:

IE6 only:  底線: ex: _background:#F00;

IE6 & 7 only: * ex: *background:#AAA;

IE8 以上\9

ex background:red \9;

IE9 only (未測試IE10吃不吃… ) :root

 

:root #example { background:#963\0 }/*IE9 only*/

 

有些特定的寫法... CSS是有先後順序的: 後面的會蓋掉前面的...

因此:

 

IE8only的寫法是要:

 

.title {background: red \9; } /* IE8 only*/

:root .title {background: black} /* IE9 only*/

在IE8之後,再把IE9以上的overwrite掉…才不會出問題。 (目前沒有找到可以一行解決的方法)

 

因此只要給IE7也是一樣…要先寫ie7的東西 然後再寫IE6的寫法把它overwrite掉

(好像可以使用+來處理… 但我懶得測... 下次又要寫萬惡IE時再來補上

 

真是討厭的寫法啊~~~

 

其他的也是一樣…很多先後順序的問題…IE7 only似乎也是要這樣子寫... 要注意先後順序。

 

 

然後有一件事要注意:有些手機似乎檔案是先抓到就先讀…不管在source html的檔案順序....

因此有優先順序的CSS最好寫在同一個檔案裡面

 

 

 

---

google陷阱: 網路上很多都會說\9是用來區分FF跟IE的,也有人說是用來讓IE8 only的

 

個人猜測寫這個的時候,應該是在IE9未出來前所寫的…

然後不知道誰起得頭…後來大家就一直抄他的了@@

 

事實上是\9會給 IE8以上的機器吃… 並不限於IE8而已。

 

要用英文查比較查得到正確資料。

 

 

以後等有IE10的機器再來補上~~

 

 

 

 

 

 

 

 

arrow
arrow
    全站熱搜
    創作者介紹
    創作者 ccas 的頭像
    ccas

    昆蟲_不在意

    ccas 發表在 痞客邦 留言(0) 人氣()