background-size:cover IE8

由於IE8瀏覽器這個坑,不支持css3的background-size:cover這個屬性,當時有一個很大的圖片須要作頁面的背景,要適應不一樣分辨率的電腦,而後就遇到了這個問題css

IE8雖然不支持這個屬性,可是有一個filter​這個屬性css3

我的認爲是這樣解釋:微軟Alpha圖片加載器​瀏覽器

filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/bg.jpg',sizingMethod='scale');

enabled :可選項。布爾值(Boolean)。設置或檢索濾鏡是否激活。true | false服務器

true:默認值。濾鏡激活,false:濾鏡被禁止。

​sizingMethod :可選項。字符串(String)。設置或檢索濾鏡做用的對象的圖片在對象 容器邊界內的顯示方式。code

​cop : 剪切圖片以適應對象尺寸orm

image: 默認值增大或減少對象的尺寸邊界以適應圖片的尺寸對象

scale : 縮放圖片以適應對象的尺寸邊界圖片

src : 必選項。字符串(String)。(指定圖片的路徑。要注意的是這個路徑是指加載濾鏡的頁面相對於圖片的路徑而不是css文件相對於圖片的路徑。這跟通常的圖片加載有區別。)字符串

上面也有問題,加上這個屬性能夠把背景圖處縮放適應屏幕了,可是出現了兩張圖片,原來的背景圖片沒有消失form

解決方法:經過css IE8的hack把背景background:none 隱藏了,解決了​

上面問題解決了,但又遇到一個坑,項目上傳到服務器上背景圖片沒有了......

解決方法:以前是把filter裏面的src屬性設置到相對圖片的路徑,如今把src 的路徑換成絕對路徑就OK了。​

相關文章
相關標籤/搜索