PNG图在IE6下透明的终极解决方案
现在做很多页面,比如阴影,或很多情况要用到透明图,GIF图一般会有很多锯齿,
用PNG图吧,效果到是还好。Firefox和IE7以上版本都 支持PNG透明,但IE6缺会显示灰白。
百度,google搜罗一通,现总结如下两种。如有更好的方案,望交流
第一种,适用于图片做背景的时候。 代码:
<style>body {background: url(body-bg.jpg); /* 添加基本背景图 */}.vehicles {width: 500px;height: 176px;background: url(vehicles.png) no-repeat; /* 为vehicles类添加背景图 */}/* 注:我在vehicles类名前添加了”html”, 我这样做就不会使background属性与另一个样式表冲突了. */html .vehicles {background: none; /* 隐藏当前背景图从而使用后面的滤镜重置它 */width: 500px; /* 必须指定宽度 */height: 176px; /* 必须指定高度 */filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='vehicles.png');}</style>
<div class=”vehicles”></div>
第二 种,适用于PNG图片放在页面上的时候
/*-------------IE6-PNG透明 ------------------------*/
* html img,
* html .png{behavior: expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",this.src = "images/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')",this.runtimeStyle.backgroundImage = "none")),this.pngSet=true));
}
/*-------------------------------------------------------------------------*/
下面是源代码
png透明图FOR-IE6.rar
---------------------------------------------------------------------------------------
第三种解决方案
附上DEMO。有需要可以下载看看。
PNG-ie6-透明
我一般采用后两个方案的结合,一个是用在页面中的图片,一个用在容器背景中的图片。
PNG图在IE6下透明的终极解决方案相关推荐
- IE6下透明PNG图片的显示
PNG(Portable Network Graphics)是W3C推荐的网页图片通用格式,但是Microsoft的IE6以下(IE7已经支持)没有把PNG的Alpha 通道打开,造成透明PNG图片的 ...
- js+css 使div背景图在ie6中透明
一个小东西 就不叙述了 banner为div的ID <script type="text/javascript"> var banner = document.getE ...
- windows7 64位下安装tensorflow终极解决方案
首先明确一个概念,pycharm中安装的包在cmd中不一定会生效 例如,pycharm中安装了pip是9.0的,在cmd中输入pip -V却显示8.0 安装这个机器学习框架需要注意如下事项: 一.wi ...
- linux mp3 乱码,linux下mp3乱码终极解决方案
只需要把mp3标签里面用gbk.gb18030.big5等编码存储的中文内容修改为Unicode编码,那么基本上所有Linux下的播放器都能正常识别mp3标签了. 关于mp3编码的转换,介绍一个工具- ...
- ie6 下最佳 PNG透明方案【转】
"咳! 哎!-.. " 你听见了么? 这些都是大家抱怨IE6下不能实现png图片漂亮的明效果的哀叫声,的确是无奈呀-.. 不过现在幸运的是,我们能够让这一切的抱怨都停止. 网络上解 ...
- IE6下Png透明最佳解决方案(推荐) Unit PNG Fix
引自:http://www.yeeyan.org/articles/view/98510/67784 网络上解决IE6下Png透明解决方案有很多,例如 IE PNG Fix from TwinHeli ...
- 使IE6下PNG背景图片透明的七种方法
PNG图像格式介绍: PNG是20世纪90年代中期开始开发的图像文件存储格式,其目的是企图替代GIF和TIFF文件格式,同时增加一些GIF文件格式所不具备的特性.流式 网络图形格式(Portable ...
- 解决IE6中 PNG图片透明的终极方案-八种方案!
"珍惜生命,远离IE6",IE6中的bug令很多Web前端开发人员实为头疼,因此不知道烧了多少脑细胞,在众多的Bug中最令人抓狂的就是IE对png图片的不支持,导致设计师和重构师放 ...
- 解决png图片在IE6下的透明问题
已经几天没更新博客了,也就是这几天学习上的进账收效甚微,原因是在准备毕业答辩的事,还有两天时间用在了跑去东莞面试,面试的结果很悲催呵呵.自己其实自我感觉还过得去吧,至少能工作,但就是自己还不够自信,在 ...
最新文章
- android短信发送乱码,解决CEMAPI发送中文短信时会乱码
- iPhone开源项目汇总(更新版)
- android 内存占用大 卡顿,安卓手机用久了就会卡顿?那是内存使用率高了,你需要这么做...
- 唯品会 1000+ 台 Hadoop 集群优化经验
- PageRank与社交网络模型评估
- 基于Servlet+jsp的web计算器
- 计算机不识别固态硬盘,电脑经常不识别固态硬盘
- Virtual KD 出现 Still cannot find RPC dispatcher table 无法连接
- plc是微型计算机,PLC控制系统与微型计算机系统的区别
- 如何低成本获得流量?分享购的商业模式了解一下
- a该内存不能为“read”或“written解决方案
- 实战 | 如何利用 Scrapy 编写一个完整的爬虫!
- Linux 安装WebLogic9.2 MP2(图文详解 教程下载)
- python ‘//’ 取整,‘%’ 取余
- 终于搞懂红黑树!--红黑树的原理及操作
- CF1367D 构造
- 如何在Mac上安装IntelliJ IDEA
- 什么是ISO(国际标准化组织)?
- python元祖_python元祖基本操作
- 计算机考研817,2017年南京工业大学计算机科学与技术学院817信号系统与数字电路考研题库...
热门文章
- ubuntu18.04安装python3.8
- elementUI 分页组件的使用 - 踩坑篇
- 测带宽的工具_发送端测试的主力设备 - 实时示波器朝向高带宽高位数发展
- newsinglethreadexecutor使用场景_java中Future的使用
- 超级SEO静态页面生成系统源码
- Deskreen – 将电脑屏幕共享到浏览器中,做第二块屏幕[Win/macOS/Linux]
- aop框架 php,xaop: 支持三种模式的AOP框架,弥补PHPer的不足,并且自带了文档的解析类库,可以一并使用,性能极好,欢迎 STAR 与 FORK。...
- mysql oracle 表空间大小_Oracle各种空间大小及占用大小
- 实用常识 | 一篇文章记录如何轻松清理C盘,C盘又满了,继续盘它
- 超几何分布_概率小题——分布列专题