IE8兼容問題
阿新 • • 發佈:2017-10-18
總結 網站 說明 -s div for ecs 出現 方便
最近做的網站,需要兼容IE8,在這裏記錄一下,碰到的問題,方便以後查看補充
1.CSS選擇器nth-child 不兼容
ul li:nth-child(2){ background-image: url(../img/2.jpg); background-size: cover; }
IE8不兼容 這種寫法 在網上百度了一下 兼容寫法 戳這裏
由於我的是少數靜態輪播圖的樣式,所以采用了 添加類名的這種比較low的方式來解決
2.CSS屬性 cover 背景自適應鋪滿容器的這個屬性 在IE8中不起作用
background-size: cover; IE8以上版本可支持
兼容寫法:
.Scroll1 .full li{ width: 100% !important; background: url(../img/1.jpg) top center no-repeat; background-size: cover; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src=‘http://static.yuntongauto.com/bjzy/img/1.jpg‘, //背景圖絕對地址
sizingMethod=‘scale‘); //scale 就是cover的全鋪
}
這裏說明一下 當設置好fliter的時候 會將樣式重寫在標簽的內聯樣式表 如圖:
所以註意一下修改樣式的問題
3. IE8下 a標簽中圖片出現border 和默認藍色 color
<a href="#"><img src="1.jpg"></a>
a標簽裏的img會出現藍色border 而且a標簽內默認字體顏色會變成藍色
這裏會需要 img{border:none;
4.video 標簽不支持
<video width="100%" height="515px" controls preload> <source src="1.mp4" type="video/mp4" codecs="avc1.42E01E,mp4a.40.2"> <!–[if lt IE 8]> <embed src="1.mp4" width="100%" height="515px" autostart=false/> <![endif]–> </video>
這裏是我自己研究出來的解決辦法 註意 embed標簽在移動端無法顯示視頻
參考了網上關於video的兼容解決 還有很多解決辦法 總結最好的 是這個 http://www.cnblogs.com/mengfangui/p/7122130.html
這是目前遇到的關於IE8的兼容 以後遇到在進行匯總
IE8兼容問題