文档章节

png-8与png-24的区别

豆豆4997
 豆豆4997
发布于 2014/06/26 13:11
字数 618
阅读 145
收藏 5
点赞 0
评论 0

进行psd切图时存储png时出现png8与png24的区别,经过网上搜索发现:

以下部分摘抄于http://blog.sina.com.cn/s/blog_9050e71e0100yvtf.html

今天我做了一个图,因为需要透明,所以我存为了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的则没有


© 著作权归作者所有

共有 人打赏支持
豆豆4997
粉丝 2
博文 12
码字总数 1438
作品 0
青岛
项目经理
切图时图片格式选择(PNG8和PNG24)

浅谈下PNG8和PNG24的区别: 1.png8和png24的根本区别,不是颜色位的区别,而是存储方式不同。 2.png8有1位的布尔透明通道(要么完全透明,要么完全不透明),png24则有8位(256阶)的布尔透明...

Yue_h ⋅ 2013/12/18 ⋅ 2

PNG-8、24、32区别介绍

知名图片压缩格式PNG,在使用大部分制图软件导出时可以选择PNG-8,PNG-24或者PNG-32。本文将介绍这三种PNG之间有什么不同。 图片的编码 首先要是想要完整的保存一张图片上的全部信息,自然是...

EchoZhou ⋅ 2017/11/26 ⋅ 0

HTML5实用手册

HTML生僻标签 HTML tabindex 属性 tabindex 属性规定元素的 tab 键控制次序(当 tab 键用于导航时)。 HTML图标字符编码 关闭图标HTML编码: 关闭图标:× 上一页:,下一页: PNG8和PNG24 顾...

前端届的科比 ⋅ 2015/11/17 ⋅ 0

GIF,JPG还是PNG选择合适的图片格式

转自:IT屌丝,码农之家 从某种程度上说,判断一个网页设计师是否优秀,可以从其在WEB开发(或网页设计)中是否合理的采用各种图片格式得出结论。事实上,或许所有人都知道图片存在GIF,JPG和...

it_hack ⋅ 2013/04/16 ⋅ 0

Android 图片资源显示效果

Android系统支持常见的图片资源格式,如jpg、png、gif等。这几种主要图片格式的特点如下: 1. Gif格式图片的特点 透明性:Gif是一种布尔透明类型,既它可以是全透明,也可以是全不透明,但是...

今日竹石 ⋅ 2013/12/16 ⋅ 0

PNG尺寸缩小实战

为了节省资源,我们希望在不同分辨率的前端上可以获取到不同尺寸的素材资源。由于最近的业务中使用的所有素材都是PNG格式的图片,并且对图片效果要求比较严格,并没有在市面上找到可以直接使...

EchoZhou ⋅ 2017/11/29 ⋅ 0

关于对每种图片格式的理解(学习记录)

有损vs无损 图片文件格式有可能会对图片的文件大小进行不同程度的压缩,图片的压缩分为有损压缩和无损压缩两种。 有损压缩。指在压缩文件大小的过程中,损失了一部分图片的信息,也即降低了图...

小海bug ⋅ 05/28 ⋅ 0

IE6 Transparent PNG Fix

After years of messing with various solutions for the IE6 PNG transparency issue (if you don't know what that is, prepare to be bored out of your skull) which mostly involve a J......

山哥 ⋅ 2011/09/11 ⋅ 0

web 图片优化

比较容易读懂,在这就不翻译了。这里总结下:图片压缩其实很简单,去掉不用的部分,选择合适的存储格式根据图片质量要求进行压缩(重点参见第二节第二段)。 Author: Susie Sahim, Web Desig...

晨曦之光 ⋅ 2012/03/09 ⋅ 0

GIF/PNG/JPG和WEBP/base64/apng图片优点和缺点整理

 GIF/PNG/JPG/WEBP/APNG都是属于位图(位图 ,务必区别于矢量图);  GIF/PNG和JPG这三种格式的图片被广泛应用在现今的互联网中,gif曾在过去互联网初期慢速的情况下几乎是做到了大一统的地位...

凡尘里的一根葱 ⋅ 2015/10/01 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

IDEA PermGen space内存溢出

解决方案: File -> Settings -> Build, Execution, Deployment / Build Tools / Maven / Runner下,找到VM Options选项,默认是空的,改为如下内容(或更大值)...

快乐的小火柴 ⋅ 9分钟前 ⋅ 0

前端常见跨域解决方案

什么是跨域? 跨域是指一个域下的文档或脚本试图去请求另一个域下的资源,这里跨域是广义的。 广义的跨域: 1.) 资源跳转: A链接、重定向、表单提交2.) 资源嵌入: <link>、<script>、<im...

临江仙卜算子 ⋅ 10分钟前 ⋅ 0

系统管理命令service

service命令用来控制系统服务的实用工具,例如启动、停止、重启和关闭系统服务,以及当前状态。当然也可以直接操作,例如/etc/init.d/mysqld restart等。 语法 service (选项)(参数) 选项...

Jpchina ⋅ 14分钟前 ⋅ 0

MySQL 联合索引的命中规则

为什么要用联合索引? 对于查询语句“SELECT T.* FROM T WHERE T.c1=1 AND T.c3=2”涉及到两列,这个时候我们一般采用一个联合索引(c1, c3);而不用两个单列索引,这是因为一条查询语句往往应...

hensemlee ⋅ 22分钟前 ⋅ 0

Spring 自动组件扫描

通常情况下都是在XML配置文件中手动声明Bean和组件的。不过Spring也可以自动扫描组件实例化Bean,这样就可以避免在XML文件中繁琐的Bean声明。 手动声明Bean: 这里不再啰嗦,就是简单地在XML...

霍淇滨 ⋅ 27分钟前 ⋅ 0

MapReduce简单需求分析-共同好友及查找互粉的情况

MapReduce的设计,最重要的是要找准key,然后制定一系列的数据处理流程。MapReduce的Map中,会把key相同的分配到同一个reduce中,对于key的选择,可以找到某个相同的因素。以下面的几个例子说...

Jason_typ ⋅ 29分钟前 ⋅ 0

springboot多数据源自动切换

SpringBoot多数据源切换,先上配置文件: 1.pom: <?xml version="1.0" encoding="UTF-8"?><project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/20......

JackyRiver ⋅ 31分钟前 ⋅ 0

Boost库编译应用

版本:Boost 1.66.0 Windows库编译 官网指南:直接执行bootstrap.bat处理文件即可,可以我却遇到一堆的问题。 环境:Windows 10 + Visual Studio 2017 Boost编译出来库命名 boost库生成文件命...

水海云 ⋅ 35分钟前 ⋅ 0

解决Eclipse发布到Tomcat丢失依赖jar包的问题

如果jar文件是以外部依赖的形式导入的。Eclipse将web项目发布到Tomcat时,是不会自动发布这些依赖的。 可以通过Eclipse在项目上右击 - Propertics - Deployment Assembly,添加“Java Build ...

ArlenXu ⋅ 35分钟前 ⋅ 0

iview tree组件层级过多时可左右滚动

使用vue+iview的tree组件,iview官网iview的tree树形控件 问题描述:tree层级过多时左右不可滚动 问题解决:修改overflow属性值 .el-tree-node>.el-tree-node_children { overflow: vi...

YXMBetter ⋅ 37分钟前 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部