網路上實在是太多假資料了…趁有記憶時寫一下好了
首先先推薦一下這個 :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的機器再來補上~~
留言列表