设置ie6下png图片及背景透明的方法:
(1)微软滤镜法:filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="xxx.png")
缺点:不支持背景重复和背景位置
(2)js插件法:(推荐)支持css背景及img 注意:css背景可使用背景重复和背景位置
插件名称:DD_belatedPNG
下载地址:http://dillerdesign.com/experiment/DD_belatedPNG/
使用方法:
<script type="text/javascript" src="js/DD_belatedPNG.js"></script> //加载js插件路径
<script type="text/javascript">
DD_belatedPNG.fix(".box"); //将类为box的div背景图设置为透明
DD_belatedPNG.fix("img"); //将图像标签img设置为透明,也可以给图片设置类哦
</script>
还可以这样同时设置多个选择器透明图像:
<script>DD_belatedPNG.fix('img, div#ramas, div#border_footer, div#menu a');</script>
当然以上脚本放在条件注释中,即<!--[if ie 6]>...<![endif]-->
css部分:
<style type="text/css">
body {
background:#f00;}
.box {
width:700px;
height:200px;
border:1px solid #000;
background:url(images/qq.png) repeat 0px 0px;
}
</style>
HTML部分:
<div class="box"></div>
<img src="images/qq.png" alt="" />
(1)微软滤镜法:filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="xxx.png")
缺点:不支持背景重复和背景位置
(2)js插件法:(推荐)支持css背景及img 注意:css背景可使用背景重复和背景位置
插件名称:DD_belatedPNG
下载地址:http://dillerdesign.com/experiment/DD_belatedPNG/
使用方法:
<script type="text/javascript" src="js/DD_belatedPNG.js"></script> //加载js插件路径
<script type="text/javascript">
DD_belatedPNG.fix(".box"); //将类为box的div背景图设置为透明
DD_belatedPNG.fix("img"); //将图像标签img设置为透明,也可以给图片设置类哦
</script>
还可以这样同时设置多个选择器透明图像:
<script>DD_belatedPNG.fix('img, div#ramas, div#border_footer, div#menu a');</script>
当然以上脚本放在条件注释中,即<!--[if ie 6]>...<![endif]-->
css部分:
<style type="text/css">
body {
background:#f00;}
.box {
width:700px;
height:200px;
border:1px solid #000;
background:url(images/qq.png) repeat 0px 0px;
}
</style>
HTML部分:
<div class="box"></div>
<img src="images/qq.png" alt="" />
发表评论
-
colgroup-table
2016-05-25 09:35 314<table width="100%" ... -
字母换行
2016-04-19 10:57 389word-break: break-all -
form上的提交
2014-10-21 10:09 290onsubmit 是表单提交时触发 onclick是按钮点击时 ... -
输入关键 鼠标点击自动删除
2014-10-21 10:09 605<input name="" typ ... -
两端对齐
2014-11-20 15:22 455text-align:justify;text-justify ... -
div里的span火狐下不兼容
2014-11-20 15:22 374display:-moz-inline-box;display ... -
一个层垂直居中于浏览器中
2014-11-20 15:22 341<!DOCTYPE html PUBLIC " ... -
导航导航导航导航
2014-11-20 15:23 390<!DOCTYPE html PUBLIC " ... -
路径(链接)
2014-11-20 15:23 319<DIV > ... -
line-height ie6失效
2014-11-25 13:44 348.gwc-border ul .gwc_66{width:11 ... -
控制框架页面或<iframe>内嵌页面在指定页面(区域)打开页面
2014-12-01 13:41 822iframe src="http://zhidao. ... -
固定背景不随滚动条滚动
2014-12-01 13:44 394<BODY style="BACKGROUND ... -
标题 更多
2014-12-01 13:47 286<head> <meta http-equi ... -
图片垂直居中
2014-09-26 14:45 0<head> <title>fdf&l ... -
rows就是行 ie6下li里图片失效解决
2014-09-26 14:45 0rows就是行,cols就是列 .box img { vert ... -
iframe不能全部显示
2014-12-01 13:42 459解决方法:DOCTYPE头部声明去掉就可以了 关键应该在wi ... -
div 换行
2014-12-01 13:42 388<div style="width:100px ... -
fieldset
2014-09-26 14:41 0<style> div{font-size:14p ... -
表格宽度内容自适应
2014-09-26 14:40 0white-space:nowrap; padding:0px ... -
ie6 position: fixed
2014-09-26 14:39 0<!--[if IE 6]> <styl ...
相关推荐
IE6下PNG背景透明的方法IE6下PNG背景透明的方法IE6下PNG背景透明的方法IE6下PNG背景透明的方法IE6下PNG背景透明的方法
IE6不兼容png透明背景解决方法,有效解决IE6下 透明图片浅灰背景的问题
IE6PNG透明背景显示灰色--解决方法(IE7.js)
IE6PNG透明背景显示灰色--解决方法(unitpngfix.js)
IE6下PNG背景透明的方法.rarIE6下PNG背景透明的方法.rarIE6下PNG背景透明的方法.rarIE6下PNG背景透明的方法.rarIE6下PNG背景透明的方法.rarIE6下PNG背景透明的方法.rar
js修复IE不能显示PNG图片透明背景的方法、解决浏览器不兼容的问题
解决IE6下PNG图片背景色不透明问题的方法
ie6 png 图片透明显示 解决ie6的不兼容alpha透明通道,使png图片ie6显示不再一片蓝边 此处我添加了个body的png透明背景,使效果看起来更明显 放在页面中时,可将body样式去除,应用到自己所需要的兼容的图片中 测试...
看了很多网上有关解决ie6下png图片透明的文章,很多都是只解决了页面上插入png图片或css背景调用,而且都没用透明效果,在ie6下仅实现了去除灰底色。特对一些优秀页面进行分析整合,整理了两套相当有效的解决方案,...
由于IE7以下不支持图片的背景的透明.根据IE特性,我们可以用IE的滤镜来实现透明处理 你只要包含下面这个pngfix.js文件就行,如下: <!--[if lt IE 7]> <script defer type="text/javascript" src="/Js/pngfix.js"> ...
IE6下PNG背景透明的方法,完美解决png格式图片在IE6下透明不兼容问题,只需简单设置即可轻松实现
IE6下PNG背景透明的七种方法.web前端开发,IE6下PNG格式不兼容
4 如果想使用背景平铺和定位的效果,以前的步骤做完之后,我们还要再引用 iepngfix_tilebg.js 这个js,才能使png图片在ie6中平铺时实现透明效果,像下面这样: <script type="text/javascript" src="iepngfix_...
今天解决png图片在IE6下的背景透明问题,找到了一个好方法。之前的解决方案会造成错位,使页面变形。现把这个方法公布如下,本人亲测可以正常使用,如果你在使用中出现问题,请看实例中的说明(英文不精的童鞋可以用...
IE6下PNG背景透明的方法(基于iepngfix.htc).zip
一共4个demo,其中 1,demo-CSS只是普通的样式,没有实现ie6透明, 2,js-png通过js文件(unitpngfix)实现了透明,但是ie6...4,最后,demo-DD,此方法完美解决,不过需要在设置png背景的div上添加class=“png”的类。