今天特意验证了一下:

切完图分别保存png24、png8和jpg60、jpg80(60和80表示保存图片时品质选择)后,

然后再压缩图片,压缩图片地址:https://tinypng.com/

图片直接拉进去就可以压缩,压缩完对比一下,没想到png24图片压缩完内存小又清晰;jpg图片反之;

未压缩之前,图片信息,如下:

 1.jpg60压缩之后:

jpg60压缩之后内存大小:47.6KB

2.jpg80压缩之后:

jpg80压缩之后的大小:47.5KB

3.png8压缩之后:

png8压缩之后大小:36.5KB

4.png24压缩之后:

png24压缩之后大小:35KB

 但也有例外:图片颜色较多的、比较复杂的,压缩之后png24格式内存比较大,举个栗子:

jpg60压缩后大图:

jpg60压缩后大小:76.3KB

png24图片压缩之后:

 png24图片压缩之后大小:116KB

综上对比图片颜色单调的png24图片压缩之后内存最小最清晰

原创,转载需要标注出处哦!

前端切图要选择png和jpg呢?的更多相关文章

  1. 前端切图神器-cutterman

    之前我写过一篇关于前端切图的博客:https://www.cnblogs.com/tu-0718/p/9741058.html 但上面的方法在切图量大时依然很费时间,下面向大家推荐这款免费切图神器 c ...

  2. 前端切图相关ps技术

    标签(空格分隔): 前端切图 复制图层到一个新的ps文件 对于单个图层 1.选中图层 2.CTRL+A全选 3.CTRL+C 4.CTRL+N新建文件,文件大小默认就可以(背景透明也在这个面板设置), ...

  3. 前端切图实战(PSD设计稿转化为前端)

    课程来源:https://www.imooc.com/learn/668 一:读设计稿 划分:头部.尾部.公共部分.大概分多少块.logo的重用.列表有哪些.各部分用什么技术实现等等. 二:建立项目目 ...

  4. 【前端切图】用css画一个卡通形象-小猪佩奇

    最近在腾讯云技术社区遇到了一位奇才,用css画出了一个社会人小猪佩奇,不得不服.研究了一下他的文章https://segmentfault.com/a/1190000014909658,感觉甚是有趣, ...

  5. ps前端切图常用快捷键

    一.新建文件:预设-自定:宽度1920,单位像素,高度自定义:分辨率:72像素/英寸:颜色模式:RGB,8位:背景色:透明:可存储预设,下次新建的时候,直接在预设中,选择那个名称,点确定.视图:显示- ...

  6. web前端切图处理

    技巧: 一. 如何在 Retina 屏幕的设备使用更高分辨率的图片 以 MacBook Pro 为例,它的标准分辨率高达 2560 x 1600,但是如果真的以这个分辨率显示网页,网页的有效区域就小的 ...

  7. 前端切图|点击按钮div变色

    <!DOCTYPE html> <html> <head> <title>点击按钮div变色.html</title> <meta c ...

  8. 前端切图:CSS实现隐藏滚动条同时又可以滚动

    CSS 实现隐藏滚动条同时又可以滚动 原始功能: 图片发自简书App 添加伪类之后的功能: 图片发自简书App 完整demo如下: <!DOCTYPE html> <html> ...

  9. 前端切图:一个好看的表格css样式

    <!DOCTYPE html><html>        <head>        <meta charset="UTF-8">  ...

随机推荐

  1. 重新设定McAfee Agent的菜单语言

    默认安装的McAfee Agent,语言会根据系统中的设置,自动选择了语言. 有时想更换语言,却又不想重装McAfee Agent (以前叫 ePO Agent) 其实可以直接运行下面的命令进行重新设 ...

  2. Shder中实现TintColor

    [Shder中实现TintColor] TintColor实现上相当于一个滤镜,若TintColor的R为0,则原图的R通道颜色应该为0.基于此,实现TintColor很容易,原图颜色直接乘以Tint ...

  3. Python help() 函数

    Python help() 函数  Python 内置函数 描述 help() 函数用于查看函数或模块用途的详细说明. 语法 help 语法: help([object]) 参数说明: object ...

  4. 【BZOJ3489】A simple rmq problem【kd树】

    题意 给出一个长度为n的序列,给出M个询问:在[l,r]之间找到一个在这个区间里只出现过一次的数,并且要求找的这个数尽可能大.如果找不到这样的数,则直接输出0.我会采取一些措施强制在线. 分析 预处理 ...

  5. 【BZOJ2806】Cheat 【广义后缀自动机+单调队列优化dp+二分】

    题意 有M篇标准作文组成了一个作文库(每篇作文都是一个01的字符串),然后给出N篇作文(自然也是01字符串).如果一个长度不小于L的串在作文库中出现过,那么它是熟悉的.对于某一篇作文,我们要把它分为若 ...

  6. spring boot 2

    服务端验证: // 1.修改实体 @Min(value = 18,message = "必须大于18岁") private int age; // 2.修改add方法 @PostM ...

  7. leetcode 62 不同的路径

    描述: m*n的矩阵,从左上角走到右下角,只能向下或向右走. 解决: 简单dp,dp[i][j]表示到i,j这点总共多少种路径. dp[i][j] = dp[i][j - 1] + dp[i - 1] ...

  8. c语言define和typedef区别和使用

    define完全可以理解替换,typedef代表别名.听着差不多的意思,那2者区别在哪? 先来个简单例子查看基本使用. //define和typedef区别 #define DB double //替 ...

  9. php解决时间超过2038年

    问题 超过2038年的时间 php怎么处理? echo date('Y-m-d',2147483647); //date函数能处理的最大整数2147483647 ->2038-01-19 就是2 ...

  10. sqlserver select 查询字段if判断用法

    SELECT TOP 1000 [id],      case when group_id>1 then 'vip'           else '普通会员'           end  F ...