详解PNG图片

   1、PNG图片类型

  PNG格式有8位、24位、32位三种,下面是一些术语:

  索引透明:类似于GIF,某一像素只有全透和全不透明两种效果Alpha透明:半透明PNG8

  8位的PNG最多支持256(2的8次方)种颜色,8位的PNG支持索引透明和alpha透明。

  PNG24

  支持2的24次方种颜色,但不支持透明信息。

  PNG32

  32位的PNG在24位的PNG基础上增加了8位的透明信息,因此支持不同程度的半透效果。

  总结

格式 颜色种类 位数 透明支持
PNG8 2的8次方 8 不支持
PNG8+索引透明 2的8次方 8 仅支持全透或全不透明
PNG8+alpha透明 2的8次方 8 支持半透明
PNG24 2的24次方 24 不支持
PNG32 2的32次方 32 支持半透明

  2、图形处理软件Fireworks

  在Fireworks中,以上提到的各种格式PNG都能正确生成,只要在OPTIMIZE面板中选择相应的格式即可。


  Photoshop

  在Photoshop(简称PS)中,PNG格式选择可以通过选择File菜单的Save for Web & Devices实现,注意:

  PS不支持8位PNG+alpha透明的格式;PS中也没有32位PNG选项,但其中的PNG24+透明实际上就是PNG32。


  3、浏览器支持情况

  IE6对PNG8和PNG32的半透明效果并不支持,用滤镜可解决PNG32的半透明问题,但解决不了PNG8的半透明效果。

  下面我们测试一下浏览器对透明PNG的支持情况,其中IE6使用滤镜对PNG图片进行加载。其余浏览器则使用img标签。经过试验,发现非IE6浏览器表现一致,而IE6对PNG8+alpha透明支持的不够好,图像半透明部分是完全按照全透明方式进行处理的。 测试结果如下图所示:


  4、总结

  1.PNG格式有8位、24位、32位三种形式。

  8位PNG支持两种不同的透明形式(索引透明和alpha透明);

  24位PNG不支持透明;

  32位PNG 在24位基础上增加了8位透明通道,因此可展现256级透明程度。

  2.图片处理工具

  Photoshop:不支持也不能输出PNG8+alpha透明的PNG;

  Photoshop:32位PNG输出是由24位PNG加透明信息形式输出;

  Fireworks:对 PNG支持较好。

  3.浏览器支持性

  非IE6的浏览器都能正常显示包含透明信息(包括索引透明和alpha透明)的PNG图片;

  IE6在滤镜的帮助下能够PNG32的透明PNG图像IE6下无论是否是用滤镜,半透明部分是完全按照全透明方式进行处理;

  IE6对 PNG8+alpha透明的图像支持不够好。

时间: 2024-08-16 13:23:38

详解PNG图片的相关文章

详解IOS图片压缩处理_IOS

前言  1.确图片的压缩的概念: "压" 是指文件体积变小,但是像素数不变,长宽尺寸不变,那么质量可能下降. "缩" 是指文件的尺寸变小,也就是像素数减少,而长宽尺寸变小,文件体积同样会减小.    2.图片压的处理 对于"压"的功能,我们可以使用UIImageJPEGRepresentation或UIImagePNGRepresentation方法实现, 如代码: //图片压 - (void)_imageCompression{ UIImage

详解Android 图片的三级缓存及图片压缩_Android

为什么需要图片缓存 Android默认给每个应用只分配16M的内存,所以如果加载过多的图片,为了防止内存溢出,应该将图片缓存起来.图片的三级缓存分别是: 内存缓存 本地缓存 网络缓存 其中,内存缓存应优先加载,它速度最快:本地缓存次优先加载,它速度也快:网络缓存不应该优先加载,它走网络,速度慢且耗流量. 三级缓存的具体实现 网络缓存 根据图片的url去加载图片 在本地和内存中缓存    public class NetCacheUtils { private LocalCacheUtils mL

详解Android 图片的三级缓存及图片压缩

为什么需要图片缓存 Android默认给每个应用只分配16M的内存,所以如果加载过多的图片,为了防止内存溢出,应该将图片缓存起来.图片的三级缓存分别是: 内存缓存 本地缓存 网络缓存 其中,内存缓存应优先加载,它速度最快:本地缓存次优先加载,它速度也快:网络缓存不应该优先加载,它走网络,速度慢且耗流量. 三级缓存的具体实现 网络缓存 根据图片的url去加载图片 在本地和内存中缓存 public class NetCacheUtils { private LocalCacheUtils mLoca

网页特效:图片随机显示实例详解

随机|特效|网页|网页特效|显示|详解 图片随机显示是一个应用非常广泛的技巧.比如随机banner的显示,当你进入一个网站时它的banner总是不同的,或者总有内容不同的提示(tips),大家在网上浏览时会经常发现这样的例子.使用这种技术,不但能在一定的空间里放入更多的内容,还可以给人一种经常更新的假象喔. 怎么样心动了吧?其实只要你有一点点html和javascript 的基础,一切都是这么简单.follow me,让我们来看看她随机的奥密. 让我们从一个简单的例子开始吧.平常我们在页面中加入

Flash动态缓冲图片导航制作详解

导航|动态|详解 缓冲公式在制作特效中非常有用,著名的三星导航菜单就用到了此公式.现在许多网站出尽风头,其中缓冲导航是其一大亮点.本文以一德国网站的导航为例,详解缓冲导航的制作.这个效果是我和溶剂共同完成的,他提供坐标的算法,我提供缩放的算法. 本例效果演示 鼠标划过的部分图片会变大 制作思路 图片缩放控制利用缓冲公式设置图片的缩放比例,如果鼠标滑过某图片,放大1.8倍.如果其它图片的序号与此图片的序号相差1,就是此图片两边的图片,放大1.4倍,其它的为原始大小. 图片坐标控制当某图片放大时,相

android 显示gif图片实例详解

  android 显示gif图片实例详解           在android中不支持gif格式的图片,但是由于我希望在我的程序中刚刚加载的时候有一个小人在跑步表示正在加载.而这个小人跑就是一个gif图片.也就是希望程序一启动时就加载gif图片.在网上查找了一些方法不知道是我使用的android的版本高(android4.4)还是什么问题就是加载不出来.最后想了一个办法加载了出来.这个办法就是将gif放在webView中让其显示. 下面是关于这个的代码: activity_prepare_fu

PHP 等比例缩放图片详解及实例代码_php技巧

直接上代码,imgzip($src,$newwid,$newhei)这个函数带进去的分别是原图片.缩放要求的宽度.缩放的长度.代码都备注了,不懂可以留言哈哈 <?php //压缩图片 缩略图 $src= "xiezheng.jpg"; $newwid=640; $newhei= 480; function imgzip($src,$newwid,$newhei){ $imgInfo = getimagesize($src); $imgType = image_type_to_ex

Android实现自定义轮播图片控件详解_Android

首先上效果图 实现原理 要完成一个轮播图片,首先想到的应该是使用ViewPager来实现.ViewPager已经有了滑动的功能,我们只要让它自己滚动.再加上下方的小圆点就行了.所以我们本次的自定义控件就是由ViewPager和LinearLayout叠加起来组成的. 一.创建一个自定义的ViewPager 先上完整的代码 package com.kcode.autoscrollviewpager.view; import android.content.Context; import andro

Symfony2使用第三方库Upload制作图片上传实例详解_php实例

本文实例分析了Symfony2使用第三方库Upload制作图片上传的方法.分享给大家供大家参考,具体如下: 我们在应用程序或者网站的个人资料里一般都有设置头像的功能,这一章我们在Symfony2里用第三方的一个比较有名Upload库来制作上传图片的功能. 一.安装第三方库 1.在composer.json文件中的"require"中加入 "codeguy/upload": "*" 2.运行指令安装 composer update 二.编码 1.编