PNG8格式图片详解

最近搜索了一下有关PNG8格式图片的详细解析。发现信息比较零散，也存在有某些争议（当然了，不排除本人搜索功力差的因素）。有说PNG8格式图片是不支持半透明的，也有持反对意见的。所有才有了写这篇文章的想法。有什么说得不对的，也欢迎大家批评指正。废话就说到这里，直接进入正题吧。

首先我们来理解一下什么叫Alpha透明和索引色透明。
Alpha透明：Alpha的数值范围为从0(黑色)到255(白色)，黑色代表透明，白色代表不透明。如果你的图片的白色部分是附着在某种颜色之上，那么即使背景是白色的，使用Alpha透明后，你图片上的白色部分仍然是不透明的。
索引色透明：索引色是画布的颜色即背景色，如果图片上存在与你设定的背景色相同的颜色的话，那么在索引色透明模式下，该图片上所有颜色里与背景色相同的部分以及背景色都将建成全透明。

PNG格式特点：
一、类型
    PNG这种图片格式包括了许多子类，但是在实践中大致可以分为256色的PNG（PNG8）和全色的PNG(PNG24、PNG32)，你完全可以用256色的png代替gif，用全色的PNG代替jpeg。
二、透明性
    PNG是完全支持alpha透明的（透明，半透明，不透明），尽管在IE6下会产生两个怪异现象（下面会做解释）。
三、动画
    PNG不支持动画

其实只要不涉及到半透明，PNG8和PNG24格式的图片并没有多大的区别，但是一旦考虑到半透明的时候，就会显示出本质上的区别。
    PNG8是一种在制作工序和理念上完全不支持半透明的图片，色差相对于PNG24要少很多，色值也只局限于1—256种颜色。所以当用到半透明的图片来表现效果的时候，PNG8就去失去了它本身的优越性。
   PNG24是一种制作工序和理念上支持半透明的图片，色差相对于PNG8要优越很多，在色值数量上也没有局限性，可以是几万种色值。它本身的优越性就在于可以让你肆无忌惮的做你想做的想要的半透明图片，而且在存储上没有半点的条件要求和限制。
    但是如果想做出半透明的PNG8格式的图片还是可能的。方法就是先制作出半透明的PNG24图片，然后再用fireworks存储为PNG8格式的图片。

PNG8的在IE6中的怪异表现：
①半透明的PNG在IE6下的浏览器显示为全透明，并且不会呈现索引色透明那么自然的过渡，会出现毛边现象；
②Alpha透明的全色PNG（PNG24）在IE中会出现灰色背景。

由上面可以总结：
a.全透明的PNG8可以在任一浏览器正常显示（就像gif一样）。半透明的PNG8在除了IE6下的浏览器下错误的显示成全透明，其它浏览器都能正常显示半透明。
b.第二个bug可以用js解决（详情请见让IE6支持图片半透明！）。

PNG8格式图片的导出问题：
①PS只能导出索引模式的PNG8格式的图片（原因是PS里认知和识别的PNG8没有利用黑白灰三种明度颜色通过alpha通道来表现半透明的机能，所以在PS里打开PNG8半透明图片的时候只是默认用相近的色相来替换半透明色相）；
②fireworks可以导出索引模式和Alpha模式的PNG8格式的图片；
③Alpha透明导出的图片比索引色透明导出的PNG8还要小。

PNG8格式图片详解相关推荐

html用九张图片做出九宫图,.九图片详解和制作
原文转自:http://www.educity.cn/wenda/101428.html .9图片详解和制作一.Button背景问题这是一张普通的.png图片(非点9图片). 我想要将它作为but ...
Excel导出带图片详解
Excel导出带图片详解导出模板一.引入的jar <dependency><groupId>org.apache.poi</groupId><artifa ...
Quartus II 8.1 详解--有图---图片详解【1讲】
Quartus II 8.1 详解--有图---图片详解看图片比较清楚,比文章清楚的多本文转自 zhangguangyi 51CTO博客,原文链接http://blog.51cto.com ...
减少HTTP请求之合并图片详解（大型网站优化技术）
一.相关知识讲解看过雅虎的前端优化35条建议,都知道优化前端是有多么重要.页面的加载速度直接影响到用户的体验.80%的终端用户响应时间都花在了前端上,其中大部分时间都在下载页面上的各种组件:图片,样 ...
html中style布局放哪,CSS样式表与格式布局详解
样式表 CSS(Cascading Style Sheets 层叠样式表),作用是美化HTML网页. 内联样式表: 例: 内联样式表内嵌样式表:必须写在head标签里例: p { 样式;} he ...
C语言标准库里的获取时间函数及时间格式转换详解
C语言标准库里的获取时间函数及时间格式转换详解头文件: #include <time.h> 相关库函数(截图摘自:https://www.runoob.com/cprogramming/ ...
XML格式文件详解及Java解析XML文件内容方法
XML格式文件详解 1.概述 XML,即可扩展标记语言,XML是互联网数据传输的重要工具,它可以跨越互联网任何的平台,不受编程语言和操作系统的限制,可以说它是一个拥有互联网最高级别通行证的数据携带者. ...
python爬取虎扑评论_python爬虫系列Selenium定向爬取虎扑篮球图片详解
前言: 作为一名从小就看篮球的球迷,会经常逛虎扑篮球及湿乎乎等论坛,在论坛里面会存在很多精美图片,包括NBA球队.CBA明星.花边新闻.球鞋美女等等,如果一张张右键另存为的话真是手都点疼了.作为程序员 ...
mip-img 不启用css,百度mip-img图片详解如何修改图片MIP
百度mip-img 图片详解,我们先来看下完整的标签 mip-img layout = responsive width = 350 height = 263 popup alt = www.xhcs ...

PNG8格式图片详解

PNG8格式图片详解相关推荐

最新文章

热门文章