视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
ie6背景透明的设置方法ie6背景颜色透明和png图像透明解决方法_html/css_WEB-ITnose
2020-11-27 15:54:21 责编:小采
文档


IE6浏览器,让我们又爱又恨。爱它的是,可以让我们写的代码的时候,可以更标准,恨的是,它有太多无厘头的IE6常见bug(详情点击),让我们焦头烂额。现在现在用百度浏览器调查,国内占有率不到6%了,但是,就怕碰到需要调兼容ie6的网站。

其中,一个IE6常见问题就是IE6透明背景问题了。透明背景主要分背景颜色透明和背景图片或者png图片透明问题。

一、IE6背景颜色透明

一般浏览器,给一个盒子透明背景写法是 :
opacity: 0.5;
-moz-opacity: 0.5;
-webkit-opacity: 0.5;
-khtml-opacity: 0.5;

其中 -moz- 是火狐 前缀 -webkit- 是谷歌和苹果浏览器前缀 -kthml- 为了linux桌面系统浏览器

IE6背景透明需要借助于 滤镜 : filter:alpha(opacity=50); 要用正版IE6测没问题哈,有时候ietester 不好用,我们也知道ietester 本来就是不是那么完整的。

ie8也比较特殊 : -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

这样差不多,就搞定了所有浏览器透明背景的 问题。

二、IE6关于png图片背景透明的问题

首先ie6不是不支持png图片透明,ie6是支持png8图片透明的,只是不支持png24和png32图像透明。因此我们再制作图片需要透明的时候, 如果要考虑IE6,最好用png8格式的。ps和firework都可以选择导出的png版本。

我们也知道,png8颜色没有png24那么丰富,有时候,必须要用png24,因此,小强老师给大家准备了一个js文件,这个js专门解决ie6 png 24 透明问题的。它可以让整个页面的png图片都透明,不需要一个一个图片的解决了,很省力,而且用法也很简单。用法如下:

第一步,把以下代码拷入到页面中。注意路径的问题哦!




EvPNG.fix('div,ul,img,li,input,span,b,h1,h2,h3,h4,a');


红色部分是选择器,大部分都包含了,其实不用*来代替的。

第二步, 把以下js文件,放入我们站点内就可以了。到现在为止,还是比较好用处理IE6PNG图片透明问题的方法。

以上是小强老师给大家分享的,希望对大家有所帮助。

小强零零壹,和你一起分享知识。

js文件下载:请点击这里

下载本文
显示全文
专题