IE6中支持PNG半透明图片完美解决方法-divcss5亲測

从IE7及IE7以上版本号都支持PNG半透明格式图片,而只有IE6不支持png格式透明图片,而GIF半透明效果不及png半透明格式图片,由此我们迫不及待须要解决IE6兼容png图片方法,这里www.divcss5.com为你介绍一种万能支持Png透明图片css hack 。

支持png透明图片解决方法图下文。

一、须要JS文件支持   -   TOP

1、须要DD_belatedPNG.js和DD_belatedPNG_0.0.8a.js文件,以下我们会提供打包下载
2、须要在须要支持png图片html页面引入这2个JS文件(2个js文件我们放入到js目录里为例)
由于是针对IE6的,其他更高版本号浏览器不须要使用此特效,所以我们使用注解式if条件让IE6读取JS文件,代码例如以下:

  1. <!--[if IE 6]>
  2. <script src="js/DD_belatedPNG_0.0.8a.js" type="text/javascript" ></script>
  3. <script type="text/javascript">
  4. DD_belatedPNG.fix(' ');
  5. </script>
  6. <![endif]-->

以上代码针对ie6 html凝视,ie6将读取解析以上if条件凝视内代码。从而让IE6引入须要的JS文件及代码。以上代码放入html网页里<head></head>之间就可以。

二、须要在使用PNG图片网页声明类   -   TOP

我们引入了JS,同一时候我们添加代码:

  1. <script type="text/javascript">
  2. DD_belatedPNG.fix(' ');
  3. </script>

1、我们在css背景属性使用png透明图片解决
假如我们对".divcss5{...}"里使用png图片,这个时候我们只需“DD_belatedPNG.fix(' ');”内的括号内做下类声明就可以解决,相应代码:

  1. <script type="text/javascript">
  2. DD_belatedPNG.fix('.divcss5 ');
  3. </script>

2、我们在html使用img标签使用png透明图片解决
假如我们在.divcss5盒子里使用的img引入png图片解决代码:

  1. <script type="text/javascript">
  2. DD_belatedPNG.fix('.divcss5 img');
  3. </script>

综合以上2点,两种情况都遇到时候,代码:

  1. <script type="text/javascript">
  2. DD_belatedPNG.fix('.divcss5 img,.divcss5');
  3. </script>

也就是在相应声明地方使用英文小写逗号分开就可以,以此类推假设遇到一个html网页中多处使用png不管是CSS背景还是html img标签,我们都能够使用逗号放开组合声明。

三、png透明解决源文件下载   -   TOP

JS及说明文件打包下载:

四:IE6支持PNG透明总结   -   TOP

解决IE6支持png图片方法:
1、须要JS文件
2、须要HTML里使用if条件注解针对IE6读取引入JS文件
3、增加须要声明的png使用的CSS类名称:

    1. <script type="text/javascript">
    2. DD_belatedPNG.fix
      (' 这里增加须要声明的css命名,多处能够使用英文小写逗号隔开');
    3. </script>

IE6 png图片实现半透明的方法的更多相关文章

  1. CSharpGL(40)一种极其简单的半透明渲染方法

    CSharpGL(40)一种极其简单的半透明渲染方法 开始 这里介绍一个实现半透明渲染效果的方法.此方法极其简单,不拖累渲染速度,但是不能适用所有的情况. 如下图所示,可以让包围盒显示为半透明效果. ...

  2. JS快速获取图片宽高的方法

    快速获取图片的宽高其实是为了预先做好排版样式布局做准备,通过快速获取图片宽高的方法比onload方法要节省很多时间,甚至一分钟以上都有可能,并且这种方法适用主流浏览器包括IE低版本浏览器. 我们一步一 ...

  3. IOS中图片拉伸技巧与方法总结(转载)

    以下内容转载自:http://my.oschina.net/u/2340880/blog/403996 IOS中图片拉伸技巧与方法总结 一.了解几个图像拉伸的函数和方法 1.直接拉伸法 简单暴力,却是 ...

  4. php 获取图片主要颜色的方法

    本文章向码农们介绍php 获取图片主要颜色的方法,主要涉及php针对图片的相关操作技巧,需要的码农可以参考一下. $i = imagecreatefromjpeg("image.jpg&qu ...

  5. jQuery编写的一款兼容IE6的图片轮播幻灯片

    jQuery编写的一款兼容IE6的图片轮播幻灯片,很不错的一款jquery特效.大家可以下载下来研究研究. 每隔几秒就自动切换一波图片,此效果兼容性还做的不错,适合居多的浏览器. 适用浏览器:IE6. ...

  6. 转载:JS快速获取图片宽高的方法

    快速获取图片的宽高其实是为了预先做好排版样式布局做准备,通过快速获取图片宽高的方法比onload方法要节省很多时间,甚至一分钟以上都有可能,并且这种方法适用主流浏览器包括IE低版本浏览器. 我们一步一 ...

  7. C#图片压缩的实现方法

    一般在web应用中,对客户端提交上来的图片肯定需要进行压缩的.尤其是比较大的图片,如果不经过压缩会导致页面变的很大,打开速度比较慢,当然了如果是需要高质量的图片也得需要生产缩略图. 一般在web应用中 ...

  8. Winform下实现图片切换特效的方法

    本文实例讲述了Winform下实现图片切换特效的方法,是应用程序开发中非常实用的一个功能.分享给大家供大家参考之用.具体方法如下: 本实例源自网络,功能较为齐全.丰富!主要功能代码如下: using ...

  9. 从word中提取图片的三种方法

    方法1:使用截图方法来提取并保存图片,如果你安装了QQ并且运行了的话,你可以使用Ctrl+Alt+A来截图,然后在QQ聊天框中按CTRL+V来保存图片,当然你可以在PS新建文档按CTRL+V来粘贴图片 ...

随机推荐

  1. iOS开发中遇到的bug

    报错:The operation couldn’t be completed. (LaunchServicesError error 0.) 解决办法:重置模拟器

  2. 【Linux命令】杀死僵尸程序

    A zombie is already dead, so you cannot kill it. To clean up a zombie, it must be waited on by its p ...

  3. Java 操作mongodb

    package cn.test.db; import java.io.File; import java.io.IOException; import java.net.UnknownHostExce ...

  4. JS拖动DIV布局

    方法一: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...

  5. Objective-C 程序设计第四版 二

    1,%@  是用于输出OC里面的对象.例如 NSString *str = @“ls kd kd kf ”; NSLog(@“%@“, str); 2,NSInteger不是一个对象,而是基本数据类型 ...

  6. Xamarin.Android开发实践(三)

    原文:Xamarin.Android开发实践(三) 一.前言 用过Android手机的人一定会发现一种现象,当你把一个应用置于后台后,一段时间之后在打开就会发现应用重新打开了,但是之前的相关的数据却没 ...

  7. IT第七天 - 类及其属性、方法的理解,断点调试初识,代码优化总结,编程逻辑培养

    IT第七天 上午 类 1.对象:是多个实体抽象出来的共同点集合,对象包括:属性(即实体的特征).方法(即尸体的功能作用) 2.程序中,用类来模拟对象 3.类是抽象的,是对象的类型,是将多个拥有相同属性 ...

  8. BZOJ 1619: [Usaco2008 Nov]Guarding the Farm 保卫牧场

    题目 1619: [Usaco2008 Nov]Guarding the Farm 保卫牧场 Time Limit: 5 Sec  Memory Limit: 64 MB Submit: 491  S ...

  9. 文本图片自适应高度小bug以及解决办法

    自定义cell的文本图片自适应高度代码,如果存在自定义的cell赋值封装,就必须将自适应高度代码写在这个方法中 点击效果: 注:- (void)layoutSubviews 方法不能同时操作,否则会出 ...

  10. 基于mini2440的IIC读写(裸机)

    mini2440开发板提供的测试代码过于复杂,让人很难理解,而且有些错误,如GPE14-15不能设置上拉电阻,可是代码里却设置了,虽然无关紧要.为了方便学习,我在闲暇之时我研究了一下.IIC的原理是比 ...