前言
最近項目做完,用戶需要兼容IE,於是開展了兼容性的調整工作。邊調整邊想感嘆IE真是個沙雕。。特將我遇到的問題記錄下來,以及記錄我的解決辦法,以下問題及解決辦法,都是真實可用的,本人親測~~
一、IE瀏覽器下,沒有達到出現滾動條的條件,但是出現了滾動塊的問題
滾動塊就是個灰色的方形,滾動條的兩邊。出現這種情況,一般是你的某個css文件,將哪個地方的overflow設置成了scroll,所以強行出現。改為overflow-y:auto即可。
二、IE瀏覽器下引入的樣式不生效,其他瀏覽器正常
這個問題是因為IE瀏覽器對引入的資源做了限制。限制規則總結一下:
1、文檔中只有前31個link或style標記關聯的CSS能夠應用。
三、強制ie以最新的版本模式對頁面進行渲染
介紹一行代碼
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
X-UA-Compatible是IE8的一個專有<meta>屬性,它告訴IE8采用何種IE版本去渲染網頁,在html的<head>標簽中使用。
Edge 模式告訴 IE 以最高級模式渲染文檔,也就是任何 IE 版本都以當前版本所支持的最高級標准模式渲染,避免版本升級造成的影響。
簡單的說,就是什么版本 IE 就用什么版本的標准模式渲染。
chrome=1 這個並不是IE模擬chrome,而是谷歌自己做的一個外掛:Google Chrome Frame(谷歌內嵌瀏覽器框架GCF)。這個插件可以讓用戶的IE瀏覽器外不變,但用戶在瀏覽網頁時,實際上使用的是Google Chrome瀏覽器內核,而且支持IE6、7、8等多個版本的IE瀏覽器
要使用chrome=1,要安裝GCF,並且指定頁面使用chrome內核來渲染。
參考文章鏈接:
https://blog.csdn.net/MEdwardM/article/details/52984648
https://www.cnblogs.com/chendc/p/5423337.html
四、IE下get請求報錯:java.lang.IllegalArgumentException: Invalid character found in the request target. The valid characters are defined in RFC 7230 and RFC 3986
五、IE下不設置背景顏色
六、IE下inout框中內容顯示不全,點擊時晃動
七、IE9不支持startwith與endswith函數
String.prototype.startWith = function(s) { if (s == null || s == "" || this.length == 0 || s.length > this.length) return false; if (this.substr(0, s.length) == s) return true; else return false; return true; } String.prototype.endWith = function(s) { if (s == null || s == "" || this.length == 0|| s.length > this.length) return false; if (this.substring(this.length - s.length) == s) return true; else return false; return true; }
八、IE9不支持flex布局
現在使用flex布局較多。可以實現互相之間的寬度互補。但是IE並不支持。
於是兩個div的情況下,使用display:inline-block與float配合使用。同時需要對寬度來進行定義。