江苏SEO

本站原创文/DemoSeo

在上篇《PNG in Windows IE-png透明功能扩展》关注了pngfix.js在页面插入png图片，可以兼容IE7.0以后的浏览器，让png图片正常显示透明效果。但是有问题，只能在页面插入图片时，这pngfix才发挥作用，而现在想让png图片做成css样式，要如何呢？这个pngfix不能完成这种效果的功能扩展。

首先说说png背景图片透明的好处，png背景图片的透明，可以同时定义颜色，这样就可以自由定义颜色，而实现页面的色彩变化，并能保持一定的风格。我做过一个情人节的页面，导航就是用了一个背景透明。可以通过变换样式，使菜单很清楚的变化色彩，并且能保持页面的整体设计效果。可以去感受一下：演示demo

如何实现呢，这也是在网络寻得的一段代码，兼容FF,IE7.0,IE6.主流的浏览器。

[code_list]

.png{
  width:200px;
  height:200px;
  background: url(../img/ss.png) no-repeat !important;   FF
  >background: url(../img/ss.png) no-repeat !important;  IE
  filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/ss.png';background: none; IE6
  
 }

[code_list]

注意几个问题：在使用过程中，filter中的地址并不是与其他样式表相同，他的使用模式类似于js，是当前页面的路径。注意../有所区别。曾使用时因此一直不成功。

png图片制作必须先定位好，不支持top left的css定位。

使用以后不能支持a标签，必须增加postion才可以调整。目前我是如此用的，不是很方便，只是偶尔使用，有兴趣的朋友可以试试。

作者: DemoSeo
原载: DemoSeo's博客(www.demoseo.com)
版权声明：本文属原创作品，转载请保留本版权信息，严禁一切非法复制。

本文链接地址：http://www.demoseo.com/DemoSeo/png-tran.html
如果你也喜欢本文，记得顶一下，支持我。你的支持是我继续发好文章的最大动力！谢谢！