当前位置:编程学习 > 网站相关 >>

PNG8和PNG24的区别有哪些

最近做图片遇到这个问题,PNG8和PNG24的区别 罗列如下:
 
今天我做了一个图,因为需要透明,所以我存为了PNG8格式,结果发现图片变了,图片变得四周都
不光滑了,四周都变得有锯齿了,而且阴影也不见了,后来存为PNG24,这些问题就消失了。
我去百度搜索了关于PNG8和PNG24的区别,看到下面的文章,原来PNG8要么完全透明,要么完全不透
明,不支持半透明,所以才会出现上面的问题,但PNG24支持半透明的。
详细请看以下文章,希望能帮到您哦,呵呵
 
一直在png图片透明这块,模糊着,虽然XXX,就是因为懒没有认真测试测试。今天看到同事要做一个这样的效果时,发现得弄弄了,于是去新浪微博看下它logo的实现时,遇到这个问题(想知道它用的什么格式的png图)。
首先先做下比较,因为估计做前端的人和我一样知道最多的就是png是一种包含半透明格式的图片。其实我们还要知道:
1.png8和png24的根本区别,不是颜色位的区别,而是存储方式不同。
2.png8有1位的布尔透明通道(要么完全透明,要么完全不透明),png24则有8位(256阶)的布尔透明通道(所谓半透明)。
png-8 和 gif 有一些相似之处,模式都是索引颜色,只支持像素级的纯透明,不支持 alpha 透明。
我们通常说的“IE6 不支持 PNG 透明”,是指不支持 PNG-24 的透明。但是 IE6 支持 PNG-8 的透明,就像支持 gif 的透明一样。
 
这样我们在工作中就有了方向:
1.色彩丰富的、大的图片切成jpg的;
2.尺寸小的,色彩不丰富的和背景透明的切成gif或者png8的;
3.半透明的切成png24。
 
回到本文开头的问题,如何区别(最简单的2种办法):
1.在ps里看图像---模式,png8当然只有8位/通道了。
2.当打开png8的图片时,ps会默认给它的图片标题上加上“索引”两字,png24的则没有。
 
最后说下png透明ie6下的解决问题:
因为懒原来只搜集了办法,没实践,发现看起来很不好,周末好好测试一番,总结一下。
新浪微博的logo(png24)采用了下面的方法来实现透明:
_background:none; 
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='logo.png',sizingMethod='crop');
但是测试发现当给background:red url(logo.png) no-repeat center;加了红色时,别的浏览器正常识别,ie6会出现依旧不识别的情况。
解决办法是在外面套的标签,或body加背景色,其他办法等周末细弄吧。(background-color:red;单独写就可以了)

================================================================


png8和png24的区别
· 文件头数据块IHDR(header chunk):包含有图像基本信息,作为第一个数据块出现并只出现一次。

· 调色板数据块PLTE(palette chunk):必须放在图像数据块之前。

· 图像数据块IDAT(image data chunk):存储实际图像数据。PNG数据允许包含多个连续的图像数据块。

· 图像结束数据IEND(image trailer chunk):放在文件尾部,表示PNG数据流结束。

在第二个数据块中包含了调色板数据块。可是,当我们去解析png24时,却未找到调色板、并且我们发现png24的存储模式是点阵颜色值加一位的阿尔法通道值构成的,这种存储模式根本不需要调色板的存在。基于这种存储模式,png24的位深最低是32位真彩,在我们看到的图像过渡中会很圆润,因为每个点都可以是不同的色彩以及不同的透明值。而这种模式也是我们最常使用、大家所理解中的png模式。至于"png"后面的“24”可见也和位深并无关系,至于为什么叫24,我也没有找到具体的答案。

png24源数据中无调色盘的存在,而在标准数据块的第二块中,却显示了调色板数据块。即然存在,肯定是有意义的,可见png有另外一种存储模式--带色盘的png8模式。png8有点类似于GIF,包含了一个调色板,并在调色板上有一个透明颜色值,这种模式在计算机的存储中,每个点阵存储的是色盘索引、并且无阿尔法半透明位。所以,png8在颜色位深上,可以低于32位;也可以使用更换色盘的技术来处理一些独特的效果;但是由于每个点阵没有阿尔法定义,边缘会像GIF一样存在锯齿现像。

好像讲的有点乱,总结一下区别吧:

· png8和png24的根本区别,不是颜色位的区别,而是存储方式不同;

· png8 色盘索引、调色板中一位透明值、不支持阿尔法通道的半透明,存储格式中每个像素无透明度的数据块定义;

· png24 无调色板、支持阿尔法通道的半透明、每个点阵都有透明度的定义,最低32位真彩色;

特性 www.zhaoxi.net 免费banner在线制作

· 支持256色调色板技术以产生小体积文件

· 最高支持48位真彩色图像以及16位灰度图像。

· 支持阿尔法通道的半透明特性。

· 支持图像亮度的gamma校正信息。

· 支持存储附加文本信息,以保留图像名称、作者、版权、创作时间、注释等信息。

· 使用无损压缩

· 渐近显示和流式读写,适合在网络传输中快速显示预览效果后再展示全貌。

· 使用CRC循环冗余编码防止文件出错。

· 最新的PNG标准允许在一个文件内存储多幅图像。

CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,