IE8 濾鏡效果filter:alpha(opacity=20);IE下失效出現(xiàn)黑色
發(fā)布時間:2013-08-28 17:52:22 作者:佚名
我要評論

IE8 濾鏡效果filter:alpha(opacity=20);失效,在Chrome,F(xiàn)F等下都是ok的,唯獨在IE下出現(xiàn)下面的黑色的,具體的解決方法如下,有類似情況的朋友可以參考下,希望對大家有所幫助
坐一個濾鏡效果,CSS樣式如下:
.mask {
width:100%;
height:100%;
background-color:#000 ;
position:fixed;
top:0px;
left:0px;
opacity:0.2;
/* IE 8 */
filter:alpha(opacity=20);
/* Firefox,Safari(WebKit),Opera */
-ms-filter:alpha(opacity=20);
/* IE 4-7 */
zoom:1;
/* set "zoom","width" or "height" to trigger "hasLayout" in IE 7 and lower */
display:none;
z-index:1;
-moz-opacity:0.2;
}
這個效果在Chrome,F(xiàn)F等下都是ok的,唯獨在IE下出現(xiàn)下面的黑色的。
實際上應(yīng)該是這樣的:
解決方式是把background-color修改成background-image: url(../img/picshow_bg.png) ; 久可以了。
復(fù)制代碼
代碼如下:.mask {
width:100%;
height:100%;
background-color:#000 ;
position:fixed;
top:0px;
left:0px;
opacity:0.2;
/* IE 8 */
filter:alpha(opacity=20);
/* Firefox,Safari(WebKit),Opera */
-ms-filter:alpha(opacity=20);
/* IE 4-7 */
zoom:1;
/* set "zoom","width" or "height" to trigger "hasLayout" in IE 7 and lower */
display:none;
z-index:1;
-moz-opacity:0.2;
}
這個效果在Chrome,F(xiàn)F等下都是ok的,唯獨在IE下出現(xiàn)下面的黑色的。

實際上應(yīng)該是這樣的:

解決方式是把background-color修改成background-image: url(../img/picshow_bg.png) ; 久可以了。
相關(guān)文章
- CSS 圖像透明度opacity想必大家并不陌生吧,使其可以讓圖片或者頁面擁有透明效果,下面為大家講解下CSS opacity的使用及其兼容性,感興趣的朋友可以參考下2013-09-08
CSS Alpha透明相關(guān)知識學(xué)習(xí)-CSS教程-網(wǎng)頁制作-網(wǎng)頁教學(xué)網(wǎng)
圖片的透明效果是網(wǎng)頁中需要用到的一種特殊形式,雖然不是非常的常用,但是遇到這樣的需求往往有點措手不及,在webjx.com的文章中雖然有這方面的CSS實例,但還沒有系統(tǒng)2008-10-17CSS教程:關(guān)于網(wǎng)頁圖片的屬性-CSS教程-網(wǎng)頁制作-網(wǎng)頁教學(xué)網(wǎng)
圖片外框特征參數(shù): ①dashed:虛線 ②dotted:點虛線 ③solid:實線 ④double:雙線 ⑤groove:溝槽狀 ⑥r(nóng)idge:脊?fàn)?⑦inset:內(nèi)嵌 ⑧outset:外嵌 CSS TP特殊效2008-10-17