CSS 在 IE 瀏覽器下失效
在網站開發時,總會發現 IE 瀏覽器跟別人不太一樣最常出事就是 CSS,CSS 在 IE 瀏覽器下失效
提供幾個從 stackoverflow 找的方法能影響下面
Do not code CSS on the HTML file
這裡應該是指 CSS Code 有很多 HTML Code 不一樣,舉個最常出現的例子就是註解。 <style type ="text/css">
<!-- You need this in order to have CSS, it has -->
p {color: blue; font-family:arial;}
</style>
沒意外上面這段註解會失效,且很可能影響下面的程式碼Make a separate CSfile and link to it
<link rel="stylesheet" href="css/style.css">
Always add <!DOCTYPE> tag to every HTML page
其中最有效的就是第三點,在每個 HTML 頁面開頭都要加上所謂的 DOCTYPE 「文件類型」,DOCTYPE 的功能主要是標準化網頁,如果沒有這個 Tag,瀏覽器會依照自己的意思去解釋,而其中 IE 最怪,所以常常失效!請把指定版本的<meta>放在第一位
原話 : Make <meta http-equiv="X-UA-Compatible" content="IE=edge">, is the first <meta> tag on your page, otherwise IE may not respect it 上面這個指定 IE 用 Edge 去讀取這段 Code,不放第一個還真的會失效,你可以用 F12 去檢查當前瀏覽頁面用的 IE 版本,如果你沒有指定 DOCTYPE,不意外會變成 IE5,很慘的...參考資料 :
1. https://stackoverflow.com/questions/595768/css-not-working-in-ie
2. http://www.flycan.com/article/css/html-doctype-97.html
3. http://www.webpage.idv.tw/maillist/maillist4/new/02/02.htm
4. https://www.itread01.com/p/648379.html
5. https://stackoverflow.com/questions/25557299/internet-explorer-11-disable-display-intranet-sites-in-compatibility-view-via