码迷,mamicode.com
首页 > 其他好文 > 详细

ie6PNG兼容

时间:2015-11-16 00:57:44      阅读:243      评论:0      收藏:0      [点我收藏+]

标签:

PNG图像格式介绍:

PNG是20世纪90年代中期开始开发的图像文件存储格式,其目的是企图替代GIF和TIFF文件格式,同时增加一些GIF文件格式所不具备的特性。流式 网络图形格式(Portable Network Graphic Format,PNG)名称来源于非官方的“PNG’s Not GIF”,是一种位图文件(bitmap file)存储格式,读成“ping”。PNG用来存储灰度图像时,灰度图像的深度可多到16位,存储彩色图像时,彩色图像的深度可多到48位,并且还可 存储多到16位的α通道数据。

IE6下PNG背景透明的显示问题

PNG格式比起GIF来表现色彩更丰富,特别是表现渐变以及背景透明的渐变要比GIF格式出色很多,目前,最新的浏览器基本上都支持PNG格式。但是IE6不支持PNG背景透明,会显示一个灰色的框。

IE6下PNG背景透明的解决办法


.pngImg { background:url(image.png); _background:url(image.gif);} 
注意上文的_号,目前IE7,8以及Firefox浏览器等都不支持此CSS语法,只有IE6识别。因此,其他浏览器会调用PNG,而IE6刚调用GIF。

 

相信如何解决png在ie6下透明的问题困扰了很多人。为了追求更好的页面效果,很多人喜欢使用png格式的图片,恰恰因为ie6下png图片的透明问题,很多人不得不退而求其次地改用gif格式的图片。今天就来介绍一个ie6下png透明的解决办法,支持background(含position、repeat、img src)。

1、 DD_belatedPNG简介:

DD_belatedPNG是一个免费的js库,它的作用是让png格式图片在ie6下透明,支持<IMG>中的src元素;在背景应用上支持css的background-image属性,当然包含最重要的是支持background-position和background-repeat,对于喜欢CSS Spirit的人来说是个好消息。

2、 实现原理:

使用Microsoft VML替代AlphaImageLoader滤镜,好处就是支持position和repeat,完美支持实现流行的CSS Spirit(CSS雪碧)。

3、 使用方法:

在<header>与</header>之间添加如下代码:

1
2
3
4
5
6
7
8
9
10
11
<!--[if IE 6]>
<script src="DD_belatedPNG.js"></script>
<script>
  /* EXAMPLE */
  DD_belatedPNG.fix(‘‘.class, #id‘‘);
  
  /* string argument can be any CSS selector */
  /* .png_bg example is unnecessary */
  /* change it to what suits you! */
</script>
<![endif]-->

 

ie6PNG兼容

标签:

原文地址:http://www.cnblogs.com/shy-z/p/4967745.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!