最小 base64 图片

时间:2023-02-04 00:41:20

http://www.webhek.com/post/base64-encode-of-1x1px-transparent-gif.html

Base64 Encode 1x1px透明GIF图片

Base64 Encode 1x1px透明GIF图片能干什么?这种图片的特征就是体积最小化,最大限度的减少带宽。而且是透明的,具有隐身作用。用到的场景很多,比如测试浏览器是否支持data URI技术,或用来做一个透明的浮动层,或在lazy load图片时用它来做占位符。

下面就是Base64 Encode 1x1px透明GIF图片的data URI数据,有一天你会用到它们。

透明图片

<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7">

黑色图片

<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAUEBAAAACwAAAAAAQABAAACAkQBADs=">

http://kaifage.com/notes/56/minimum-transparent-image.html

最小尺寸的透明图片

按照GIF89a Spec的规范,一张最小的透明图片大小为43字节,去掉颜色表(color table)后的“非规范”图片大小为37字节,这可能是最小的实际使用的透明图片了。如果是非透明的还可以更小。

最小图片的base64使用代码:

<img src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==">

作为标准GIF文件(43字节)的GIF 文件结构解析如下:

  • Header, 6 bytes: 包含 “GIF” 和所采用标准的版本,如 “GIF89a”.
  • Logical Screen Descriptor, 7 bytes: 包含文件大小、颜色表(color table)等
  • Global Color Table, 6 bytes: 对应RGB,每3字节表示一个
  • Graphic Control Extension, 8 bytes: 指明第二类颜色如何处理,如作为透明、动画参数等
  • Image Descriptor, 10 bytes: 位置和大小信息,对动画型gif,可以包含多帧信息
  • Image Data, 5 bytes: LZW 压缩算法的图片数据.
  • GIF Trailer, 1 byte: 文件结束符,3B

via: http://probablyprogramming.com/2009/03/15/the-tiniest-gif-ever

--- xw

data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVQImWNgYGBgAAAABQABh6FO1AAAAABJRU5ErkJggg==
data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7 透明:
data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
黑色:
data:image/gif;base64,R0lGODlhAQABAIAAAAUEBAAAACwAAAAAAQABAAACAkQBADs=

最小 base64 图片的更多相关文章

  1. 编写base64图片文件

    base64编码代替css背景图片在网站上应用是很广泛的,例如:loading gif图片,天猫加载时那只猫等等. 因为base64图片可以减少http请求,所以我们经常会把不经常改动的,独立的,尺寸 ...

  2. MVC显示Base64图片

    本篇演示ASP.NET MVC应用程序,显示Base64图片. Insus.NET浏览网页,发现一个站点http://www.base64-image.de/ 想起以前也有实现过<如何把数据流转 ...

  3. img src 使用 base64 图片数据

    img src 使用 base64 图片数据 在网页上显示一张图片通常是 <img src="xxx.png" > 或 <img src="www.ur ...

  4. Base64 图片转换工具

    以前在写asp的后台的时候,有一个上传功能是必须的,那时候进行的图片预览(未上传前)其实就是获取本地的图片路径来显示图片,但是随着HTML5的出现,可以把图片通过编码来实现预览. 在雅虎的36条速度优 ...

  5. base64图片在各种浏览器的兼容性处理

    IE浏览器目前最高的版本是v11,而微软放弃了IE,转向新的浏览器开发,并取名为Edge.base64图片在IE9及以后的图片均能显示没有问题,而Firefox, Chrome, Safari等非IE ...

  6. Base64图片与UIImage的相互转化

    http://blog.csdn.net/fudesign2008/article/details/38903085 Base64图片 -> UIImage - (UIImage *) data ...

  7. 利用cropper插件裁剪本地图片,然后将裁剪过后的base64图片上传至七牛云空间

    现在做的项目需要做一些图片处理,由于时间赶急,之前我便没有处理图片,直接将图片放在input[type=file]里面,以文件的形式提交给后台,这样做简直就是最低级的做法,之后各种问题便出来了,人物头 ...

  8. PHP将图片转base64编码以及base64图片转换为图片并保存代码

    图片转base64编码 /*图片转换为 base64格式编码*/ $img = 'uploads/01.png'; $base64_img = base64EncodeImage($img); ech ...

  9. Base64图片转Blob对象

    //将Base64图片转成Blob对象 //@args: base64Url:编码字符串,contentType:类型. function base64UrltoBlob(base64Url, con ...

随机推荐

  1. html学习第一天笔记——第七章节

    第7章 CSS样式基本知识<span style="color:blue"> </span>嵌入式css样式,写在当前的文件中[**********]嵌入式 ...

  2. HtmlAgilityPack抓取搜房网数据简单示例

    HtmlAgilityPack是一个开源的解析HTML元素的类库,最大的特点是可以通过XPath来解析HMTL,如果您以前用C#操作过XML,那么使用起HtmlAgilityPack也会得心应手.目前 ...

  3. The web application &lbrack;&sol;codeMarket&rsqb; registered the JBDC driver&lbrack;&period;&period;&period;&period;&period;&period;&period;&period;&period;&rsqb; but failed to unregister it when the web application was stopped&period; To prevent

    如果你报错了上面的这个严重,那么你的tomcat版本一定是在6.0.25之上的 原因:tomcat 6.025以后在sever.xml中引入了内存泄露侦测,对于垃圾回收不能处理的对像,它就会做日志. ...

  4. File类的基本操作之读出所有目录路径

    package org.mark.file; import java.io.File; /** * File类的基本操作之读出所有文件夹路径 * 假设给定一个文件夹,要求将此文件夹中的所有文件都列出来 ...

  5. IE8&plus;等兼容、360调用webkit内核小记

    首先是处理IE8.9等的兼容问题,注意以下几点: 1,尽可能严格要求自己使用w3c推荐的方式编写html/css 2,在html页面顶部添加<!DOCHTML html>,不清楚请查看参考 ...

  6. 【Python之基本数据类型 基本运算】

    一.基本数据类型 1.字符串 类:str 方法:选中str,按住command(ctrl)+左键跳转至对应的方法 字符串常用方法归纳如下: 1)capitalize 功能:实现字符串首字母大写,自身不 ...

  7. Sublime Text 关闭自动更新的办法

    解决关于Submit Text每次打开 都会跳出更新选项的问题 Windows 下: 打开 Preferences —— Settings—User { "color_scheme&quot ...

  8. 读Zepto源码之IOS3模块

    IOS3 模块是针对 IOS 的兼容模块,实现了两个常用方法的兼容,这两个方法分别是 trim 和 reduce . 读 Zepto 源码系列文章已经放到了github上,欢迎star: readin ...

  9. ios8新的api

    self.navigationController.hidesBarsOnSwipe=YES; 滚动时隐藏导航栏

  10. App分享之微信微博等各个社交平台的分享授权规则和常见问题

    一.新浪微博分享规则 新浪微博支持分享类型: 应用内分享也就是网页分享支持: 文字,文字+图片,要分享链接需要链接添加在text里分享 客户端分享支持:文字,图片,文字+图片,图片+文字+链接 参数说 ...