作者coldollsheep (加油加油^^)
看板Web_Design
標題[心得] IE9 CSS DOCTYPE selecter
時間Sat Mar 17 11:33:13 2012
算不上心得 因為得出來的答案解法實在太令人震驚
這段故事是這樣子的...
一般人都會認為 新的東西會把舊版本不好的東西移除或是做個改善
所以我在設計網頁的時候 我會測三個瀏覽器
CHROME FF IE8
我之前稍微做過測試發現IE9很多地方尤其是CSS
已經不像以前的IE那麼讓人意外
基本上會跟其他瀏覽器一致，所以我就測IE8(我知道IETESTER 感謝)
但是當我偶然用家裡的IE9測一下我在公司寫的東西的時候
赫然發現 我寫的東西是這樣
http://www.sheephead.com.tw/tmpimg/img1.png
不是吧...我腦中飛快閃過五十六個駭客或是公司最近是否與人結怨
我用CHROME開
http://www.sheephead.com.tw/tmpimg/img2.png
..............
不是吧...IE9 虧我都有一點點相信你了 直到
我現在膝蓋重了一箭
經過簡單的測試 發現是CSS中的子代選擇器失效
例如說
<div>
<p>test test</p>
</div>
用以下的CSS會悲劇
div p {
color:red;
}
完全不理我就對了
我在網路上查到一些知識
1.在IE9中按下F12 可以調整你想用哪個瀏覽模式來觀看
我調整成IE8，的確是正常的狀態
不過這個我不適用，因為使用者一多 這個方法越顯得自找麻煩
2.DOCTYPE
因為用了HTML5的<!DOCTYPE html>都沒問題
所以後來才往這個方向來找
下面這篇文章有跟我類似的問題，這個老兄改成XHTML 1.0 過度版本
http://tinyurl.com/7ob4dda
但是對我並不適用...甚至就算可以解決我的這個困難
我也不願意，因為等於宣告了我以後在IE9不能正常使用HTML5標籤
3.換主機
這時候我真的生氣了，包包款款...我把檔案拿到別台主機上執行
我會這樣想是因為 我同樣的程式碼在JSFIDDLE跑起來正常無比
沒道理你知道嗎??
換主機後 網址:
http://www.sheephead.com.tw/tmpimg/test.html
難道程式碼還會認人?為什麼在JSFIDDLE上就那麼正常??
-------------
但是本少爺還是解決了
我死馬當司馬懿
我在程式碼最前面加了
<div>
<p>test test</p>
</div>
<style>
div p {
color:red;
}
</style>
居然正常顯示了.....
網址:
http://www.sheephead.com.tw/tmpimg/test2.html
你們自己對照原始碼，其他程式碼一模一樣 也沒載入其他CSS 也沒JS
最後我只好，真的是只好 在我的專案多放一個<div></div>
在檔案面前....顯示正常
後來測試不管放甚麼標籤都可以，最後我決定放一個最無害的<span></span>
不管甚麼標籤 只要放在form前面就搞定...
解法:隨便放標籤在FORM前面....
--
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 122.116.9.103
→ superpai:....... 你<html><head><body>通通都沒有寫 03/17 12:15
→ coldollsheep:ㄏ 從來都不管他的 看來也是個解決方法 03/17 17:24
→ s25g5d4:不照標準 噴了也不能怪IE9啊... 03/17 17:32
→ tyf99:IE9表示: 好啦，都怪我囉. 03/17 17:34
推 pm2001:瀏覽器能夠容錯parse出網頁你該哭著感謝他了 03/17 18:24
→ Rplus:這是網頁撰寫者的問題... 03/17 19:17
→ coldollsheep:= =好咩好咩...可是我去W3去驗證的時候 都沒事... 03/17 23:33
