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图片都透明,不需要一个一个图片的解决了,很省力,而且用法也很简单。用法如下:

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

<script src="iepng.js" type="text/javascript"></script>

<script type="text/javascript">
   EvPNG.fix('div,ul,img,li,input,span,b,h1,h2,h3,h4,a');
</script>

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

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

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

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

js文件下载:请点击这里

ie6背景透明的设置方法 ie6背景颜色透明和png图像透明解决方法的更多相关文章

  1. yum安装命令:遇到的问题报错如下: File "/usr/bin/yum", line 30 except KeyboardInterrupt, e: 通过看报错可以了解到是使用了python2的语法,所以了解到当前yum使用的Python2,因为我单独安装了python3,且python3设置为默认版本了,所以导致语法问题 解决方法: 使用python2.6 yum install

    1.安装zip yum install -y unzip zip 2.安装lrszs yum -y install lrzsz 3.安装scp 遇到下面的问题: 结果提示: No package sc ...

  2. Foxmail 登录 qq 账号时无法登录 提示我们设置了独立密码或使用授权码登录的解决方法

    Foxmail 登录 qq 账号时无法登录  提示我们设置了独立密码或使用授权码登录的解决方法 1.首先我们设置我们邮箱的类型如下图所示 2.打开网页版的qq邮箱  在设置--->账户---&g ...

  3. 让IE6、IE7、IE8、IE9、IE10、IE11支持Bootstrap的解决方法

    最近做一个Web网站,之前一直觉得bootstrap非常好,这次使用了bootstrap3,在chrome,firefox,safari,opera,360浏览器(极速模式).搜狗浏览器等浏览器下均没 ...

  4. css 对div用hover设置border,出现抖动和div走位问题,解决方法

    样式设置 : div:hover { border:1px solid red;} 当鼠标移动到div时,产生抖动和偏移. 产生的原因: 是因为设置border时设置了1px边框,多出的这1px,与其 ...

  5. 将display设置为inline-block之后产生间隙然后换行问题的解决方法

    在我们会用display的时候,inline-block肯定不陌生吧,我今天在做项目的时候,用了inline-block,使a标签可以自定义宽度,但是随之而来的问题就是换行的BUG,如下图 特地加了一 ...

  6. MVC dropdownlist 后端设置select属性后前端依然不能默认选中的解决方法

    -----------------------------------来自网上的解决方法--------------------------------------------- ASP.Net MV ...

  7. Struts2中使用execAndWait后,在 Action中调用getXXX()方法报告java.lang.NullPointerException异常的原因和解决方法

    使用 Struts2 编写页面,遇到一个要长时间运行的接口,因此增加了一个execAndWait ,结果在 Action 中调用 getContext()的时候报告异常 ActionContext c ...

  8. 关于jQuery的append方法不能多次添加同一个DOM元素的解决方法

    资料来自:https://segmentfault.com/q/1010000007677851?_ea=1419689 append()方法在jQuery中是使用appendChild()实现的,实 ...

  9. IE6设置li的float:left,不能自适应宽的解决方法

    原文地址:https://blog.csdn.net/u012299002/article/details/50589453 做个divcss页面,发现在IE6下,设置了li的float:left,L ...

  10. 首页背景图片在PC端有显示,在手机端不显示的解决方法

    今天看博客的资源大小,发现背景图片有44k大的吓人,准备压缩一下. 压缩之后才发现,我的背景图片在手机端是没有显示的.原因是背景图片不支持缩放. 上网查了下,发现加入如下代码之后就支持缩放了: bac ...

随机推荐

  1. 通过Manifest的配置信息实现页面跳转,及总结

    1:新建一个xml文件,如second_view.xml文件,然后新建一个Activity如SecondActivity.java并在里面设置setContentView(R.layout.secon ...

  2. Css小技巧-图片垂直居中

    说明:样式设置主要是针对图片的父级元素,并非图片元素本身. Css代码[图片父级点的样式]: <style> .box { /*非IE的主流浏览器识别的垂直居中的方法*/ display: ...

  3. 软件源(Software Sources)

    写在前面:浏览了很多国内外的网站,看了很多关于软件源(Software Sources)设置的文章,发现有很多文章中对软件源的设置存在误解,为了让新人能顺利进入Ubuntu的大家庭,特地作此文,详细地 ...

  4. jquery 几点注意事项

    jquery触发hover事件 使用 mouseenter/mouseleave/mouseover/mouseout

  5. Android 6.0 新特性 整理 资料来自网络

    Android 6.0新特性 Runtime Permissions Doze and App Standby Apache HTTP Client Removal BoringSSL Access ...

  6. pkusc2015

    Mex 题目大意:给出一个序列\(a\),定义\(f(l,r)\)为集合{\(a_l, a_{l+1}, -, a_r\)}的sg值,求\(\sum_i \sum_{j(i\leq j)} f(i,j ...

  7. HDU1163【九余数定理】【水题】

    Eddy's digital Roots Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Oth ...

  8. Linux CPU 负载度量公式

    一个top命令不就行了么?顶多再加一些管道什么的过滤一下.我一开始也是这么想得.其实还可以理解的更多. 首先一个问题,是统计某个时间点的CPU负载,还是某个时间段的? 为了画折线图报表,一般横坐标都是 ...

  9. 【Java线程】锁机制:synchronized、Lock、Condition

    http://www.infoq.com/cn/articles/java-memory-model-5  深入理解Java内存模型(五)——锁 http://www.ibm.com/develope ...

  10. 【Hibernate】Remember that ordinal parameters are 1-based!

    此错误的官方解释:1.当hql中不需要参数,而传递了参数导致,2.set参数时没有从0开始. 但此问题不属这两种. 检查导入的libraries无错误. 最后在网络搜索到:http://qihaihu ...