PNG32 透明问题(1)

系统 2017 0

    一. 索引透明,布尔透明, alpha 透明

    索引透明:fireworks中可以选择某一颜色作为透明输出;

    布尔透明:只能为不透明或全透明;

    alpha透明:有不透明,全透明和半透明。

    二. PNG8, PNG24, PNG32

    现在都提倡用PNG8,好处就不用多说了.但是fireworks和photoshop导出的PNG图片却有一些不同。

    1. fireworks

    (1. 可以导出布尔透明,alpha透明的PNG8,半透明的PNG8在IE6下全透明,用滤镜可以解决。对于边框发光的效果,倒是一种很好的退化方案。

    IE6,

    非IE6

    (2 可以导出不透明的PNG24,即和JPG的效果相同;

    (3. 可以导出alpha透明PNG32。

    2. photoshop

    (1. 只能导出布尔透明的PNG8;

    (2. 可以导出alpha透明的PNG24, 无法导出PNG32。

    测 试 。应该说PNG24和PNG32是一样, The difference between PNG24 and PNG32 ( 翻 译 )中指出PNG32中每个像素不仅存储了24位真彩信息还存储了8位alpha通道。所以fw导出PNG32不用选择透明,而ps导出 PNG24时是要勾选透明度的,这时候的PNG24应该就转化成了PNG32了吧。

    三. IE6 中透明 PNG 解决方案

    1. AlphaImageLoader滤镜

    PNG在IE6最常用的解决方案是使用滤镜。

    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=”images/img.png”, sizingMethod=”scale”);

    MSDN 中详细介绍了该滤镜。重点提一下sizingMethod属性 吧,sizingMethod=image/scale/crop:image:默认值,增大或减小对象的尺寸边界以适应图片的尺寸;scale:缩放图 片以适应对象的尺寸边界;crop:剪切图片以适应对象尺寸。

    但使用滤镜存在很多问题:

    (1. 内存问题,有建议说使用滤镜最好不用超过5到6个。

    这个滤镜的问题在于浏览器加载图片时它会终止内容的呈现并且冻结浏览器。在每一个元素(不仅仅是图片)它都会运算一次,增 加了内存开支……

    (2. 链接失效,表单无法获焦。

    解决方法:使链接和表单元素拥有haslayout,通常是加上position:relavtive,经过测试 position:absolute也可以。但是当父级定义position:absolute时,这种方法会失效。不过这种方法不太稳定;另一种方法, 是将背景层和内容层分开,不作为嵌套关系,而作为同级关系。

    (3. 使用滤镜的图片只能作为背景图,且无法平铺。

    因此尽量少使用滤镜.

    源文档 < http://blog.sina.com.cn/s/blog_692a9ee30100k6yr.html >

PNG32 透明问题(1)


更多文章、技术交流、商务合作、联系博主

微信扫码或搜索:z360901061

微信扫一扫加我为好友

QQ号联系: 360901061

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描下面二维码支持博主2元、5元、10元、20元等您想捐的金额吧,狠狠点击下面给点支持吧,站长非常感激您!手机微信长按不能支付解决办法:请将微信支付二维码保存到相册,切换到微信,然后点击微信右上角扫一扫功能,选择支付二维码完成支付。

【本文对您有帮助就好】

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描上面二维码支持博主2元、5元、10元、自定义金额等您想捐的金额吧,站长会非常 感谢您的哦!!!

发表我的评论
最新评论 总共0条评论