本站业务范围:1、PC端软件开发、网站开发 2、移动端APP、网站、微信接口、微商城开发 3、视频教程、课程设计和辅导 4、单片机开发 5、串口通讯调试
 当前位置:文章中心 >> Gulp/Grunt/webpack
立即购买视频教程 对png8图片格式的误解
夜鹰教程网 来源:www.yyjcw.com 日期:2016-11-29 14:40:21
对png8图片格式的误解

这篇文章不能解决你的问题?我们还有相关视频教程云课堂 全套前端开发工程师培训课程

微信号:yyjcw10000 QQ:1416759661  远程协助需要加QQ!

业务范围:视频教程|程序开发|在线解答|Demo制作|远程调试| 点击查看相关的视频教程

技术范围:全端开发/前端开发/webapp/web服务/接口开发/单片机/C#/java/node/sql server/mysql/mongodb/android/。 



Gif格式特点

  • 透明性
    Gif是一种布尔透明类型,既它可以是全透明,也可以是全不透明,但是它并没有半透明(alpha 透明)。
  • 动画
    Gif这种格式支持动画。
  • 无损耗性
    Gif是一种无损耗的图像格式,这也意味着你可以对gif图片做任何操作也不会使  得图像质量产生损耗。
  • 水平扫描
    Gif是使用了一种叫作LZW的算法进行压缩的,当压缩gif的过程中,像素是由上到下水平压缩的,这也意味着同等条件下,横向的gif图片比竖向的gif图片更加小。例如500*10的图片比10*500的图片更加小
  • 间隔渐进显示
    Gif支持可选择性的间隔渐进显示

由以上特点看出只有256种颜色的gif图片不适合照片,但它适合对颜色要求不高的图形(比如说图标,图表等),它并不是最优的选择,我们会在后面中看到png是最优的选择。

Jpeg格式特点

  • 透明性
    它并不支持透明。
  • 动画
    它也不支持动画。
  • 损耗性
    除了一些比如说旋转(仅仅是90、180、270度旋转),裁切,从标准类型到先进类型,编辑图片的原数据之外,所有其它操作对jpeg图像的处理都会使得它的质量损失。所以我们在编辑过程一般用png作为过渡格式。
  • 隔行渐进显示
    它支持隔行渐进显示(但是ie浏览器并不支持这个属性,但是ie会在整个图像信息完全到达的时候显示)。

由上可以看出Jpeg是最适web上面的摄影图片和数字照相机中。

Png格式特点

  • 类型
    Png这种图片格式包括了许多子类,但是在实践中大致可以分为256色的png和全色的png,你完成可以用256色的png代替gif,用全色的png代替jpeg
  • 透明性
    Png是完全支持alpha透明的(透明,半透明,不透明),尽管有两个怪异的现象在ie6(下面详细讨论)
  • 动画
    它不支持动画
  • 无损耗性
    png是一种无损耗的图像格式,这也意味着你可以对png图片做任何操作也不会使  得图像质量产生损耗。这也使得png可以作为jpeg编辑的过渡格式
  • 水平扫描
    像GIF一样,png也是水平扫描的,这样意味着水平重复颜色比垂直重复颜色的图片更小
  • 间隔渐进显示
    它支持间隔渐进显示,但是会造成图片大小变得更大

更多关于PNG

  • PNG8
    256色PNG的别名
  • PNG24
    全色PNG的别名
  • PNG32
    全色PNG的别名

其它图片格式与PNG比较

众所周知GIF适合图形,JPEG适合照片,PNG系列两种都适合。

  • 相比GIF
    PNG 8除了不支持动画外,PNG8有GIF所有的特点,但是比GIF更加具有优势的是它支持alpha透明和更优的压缩。所以,大多数情况下,你都应该用PNG8不是GIF(除了非常小的图片GIF会有更好的压缩外)。
  • 相比JPEG
    JPEG比全色PNG具有更加好的压缩,因此也使得JPEG适合照片,但是编辑JPEG过程中容易造成质量的损失,所以全色PNG适合作为编辑JPEG的过渡格式.

系列二:对png8的误解

Png8的在ie中的怪异表现:

1.半透明的png8在ie6以下的浏览器显示为全透明。

2.Alpha透明的全色PNG(png32)在ie6中会出现背景颜色(通常是灰色)。

由上面可以总结:

(a)全透明的png8可以在任一浏览器正常显示(就像gif一样)。半透明的png8在除了ie6及其以下的浏览器下错误的显示成全透明,其它浏览器都能正常显示半透明。这个bug并不需要特殊对待,因为在不支持半透明的浏览器下只是显示为全透明,对用户体验影响不大,它反而是透明gif的加强版。

(b)第二个bug没有什么好的方法解决,只能通过影响性能的方法AlphaImageLoader与需要加特殊标签(VML)。

因此得出结论就是:请使用PNG8。

Png8的软件问题

1.Photoshop只能导出布尔透明的PNG8。

2.Fireworks既能导出布尔透明的PNG8,也能导出alpha透明的PNG8.

3.pngquant与pngnq这两个命令行软件可以转换全色png为256色的png8。

复制链接 网友评论 收藏本文 关闭此页
上一条: 平面设计的7种表现手法  下一条: 用好Photoshop的手足兄弟 ImageReady
夜鹰教程网成立于2008年,目前已经运营了将近 13 年,发布了大量关于 html5/css3/C#/asp.net/java/python/nodejs/mongodb/sql server/android/javascript/mysql/mvc/easyui/vue/echarts原创教程。 我们一直都在坚持的是:认证负责、一丝不苟、以工匠的精神来打磨每一套教程,让读者感受到作者的用心。我们默默投入的时间,确保每一套教程都是一件作品,而不是呆板的文字和视频! 目前我们推出在线辅导班试运营,模式为一对一辅导,教学工具为QQ。我们的辅导学科包括 java 、android原生开发、webapp开发、商城开发、C#和asp.net开发,winform和物联网开发、web前端开发,但不仅限于此。 普通班针对的是国内学员,例如想打好基础的大学生、想转行的有志青年、想深入学习的程序员、想开发软件的初学者或者业余爱好者等。 就业办针对即将毕业上岗的大四学生,或者打算转行的初级开发工程师。 留学生班针对的是在欧美、加拿大、澳洲、日本、韩国、新加坡等地留学的中国学子,目的是让大家熟练地掌握编程技能,按时完成老师布置的作业,并能顺利地通过考试。 详细咨询QQ:1416759661   夜鹰教程网  基于角色的权限管理系统(c-s/b-s)。
  夜鹰教程网  基于nodejs的聊天室开发视频教程
  夜鹰教程网  Git分布式版本管理视频教程
  夜鹰教程网  MVC+EasyUI视频教程
  夜鹰教程网  在线考试系统视频教程
  夜鹰教程网  MongoDB视频教程。
  夜鹰教程网 Canvas视频教程
  夜鹰教程网 报表开发视频教程
  推荐教程/优惠活动

  热门服务/教程目录

  夜鹰教程网  新手必看,详细又全面。
  夜鹰教程网  购买教程  夜鹰教程网  在线支付-方便
  夜鹰教程网  担保交易-快捷安全   夜鹰教程网  闪电发货
  夜鹰教程网  电话和QQ随时可以联系我们。
  夜鹰教程网 不会的功能都可以找我们,按工作量收费。

客服电话:153 9760 0032

购买教程QQ:1416759661  
  热点推荐
快速批量去除图片水印效果
PS插件大全介绍
PhotoShop“自由变形”工具用法
如何制作透明效果水印字
PhotoShop方便快捷的实用小技巧
如何制作建筑效果图
菜鸟谈如何学习PS
用PhotoShop将模糊人物变清晰
PSD网页模版转化XHTML网页
对png8图片格式的误解
非主流ps教程实用的几种技巧汇总
JS实现模拟FLASH幻灯片图片切换网…
平面设计的7种表现手法
AutoCAD模拟空间与图纸空间简介
图像处理技术(二)
  尊贵服务
夜鹰教程网 承接业务:软件开发 网站开发 网页设计 .Net+C#+VS2008+MSsql+Jquery+ExtJs全套高清完整版视频教程
  最近更新
gulp自动化构建详解
gulp静态站点构建项目文件结构
设计师与客户在设计开始前需要讨论…
PhotoShop方便快捷的实用小技巧
PSD网页模版转化XHTML网页
平面设计的7种表现手法
对png8图片格式的误解
用好Photoshop的手足兄弟 ImageRe…
Adobe Photoshop常见问题之专家会…
如何制作建筑效果图
PhotoImpact 图像缝合
PS插件大全介绍
Photoshop之层、通道、路径详解
图像处理技术(二)
图像处理技术(一)
  工具下载  需要远程协助? 

sql2008视频教程 c#视频教程

VIP服务:如果您的某个功能不会做,可以加我们QQ,给你做DEMO!

JQUERY  Asp.net教程

MVC视频教程  vs2012
.NET+sql开发
手机:15397600032 C#视频教程下载
微信小程序 vue.js高级实例视频教程

教程咨询QQ:1416759661


这篇文章不能解决你的问题?我们还有相关视频教程云课堂 全套前端开发工程师培训课程

微信号:yyjcw10000 QQ:1416759661  远程协助需要加QQ!

业务范围:视频教程|程序开发|在线解答|Demo制作|远程调试| 点击查看相关的视频教程

技术范围:全端开发/前端开发/webapp/web服务/接口开发/单片机/C#/java/node/sql server/mysql/mongodb/android/。 



关于我们 | 购买教程 | 网站建设 | 技术辅导 | 常见问题 | 联系我们 | 友情链接

夜鹰教程网 版权所有 www.yyjcw.com All rights reserved 备案号:蜀ICP备08011740号3