嵌入Base64图像

 

纯粹出于好奇，Base64图像嵌入工作在哪些浏览器？ 我指的是这个。

我意识到这通常不是一个很好的解决方案，因为它大大增加了页面大小 - 我只是好奇。

一些例子：

HTML： 

<img alt="Embedded Image" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA..." />

CSS： 

div.image {
  width:100px;
  height:100px;
  background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA...);
}

更新：2017-01-10

所有主流浏览器现在都支持数据URI。 IE也支持从版本8开始嵌入图像。

http://caniuse.com/#feat=datauri

现在，以下Web浏览器支持数据URI：

  • 基于壁虎的Firefox，SeaMonkey，XeroBank，Camino，Fennec和K-Meleon
  • Konqueror，通过KDE的KIO从站输入/输出系统
  • Opera（包括诸如Nintendo DSi或Wii之类的设备）
  • 基于WebKit的，例如Safari（包括iOS），Android的浏览器，Epiphany和Midori（WebKit是Konqueror的KHTML引擎的衍生产品，但Mac OS X不共享KIO架构，因此实现方式不同）以及Webkit /铬，如铬
  • 三叉戟
  • Internet Explorer 8：由于安全原因，Microsoft限制了对某些“不可导航”内容的支持，包括担心嵌入在数据URI中的JavaScript可能无法通过基于Web的电子邮件客户端使用的脚本过滤器解释。 版本8中的数据URI必须小于32 KiB [3]。
  • 数据URI仅支持以下元素和/或属性[4]：
  • 对象（仅限图像）
  • IMG
  • 输入类型=图像
  • 链接
  • 接受URL的CSS声明，例如background-image，background，list-style-type，list-style和similar。
  • Internet Explorer 9：Internet Explorer 9不具有32KiB限制，并允许使用更广泛的元素。
  • TheWorld浏览器：一个IE外壳浏览器，它具有对Data URI方案的内置支持

    • http://en.wikipedia.org/wiki/Data_URI_scheme#Web_browser_support

    大多数现代桌面浏览器（如Chrome，Mozilla和Internet Explorer）都支持编码为数据URL的图像。 但在某些移动浏览器中显示数据网址时出现问题：Android Stock Browser和Dolphin Browser不会显示嵌入的JPEG 。

    我建议您使用以下工具进行在线base64编码/解码：

  • 编码为Base64格式

  • 从Base64格式解码

    • 选中“格式化为数据网址”选项以格式化为数据网址。

    我可以使用（http://caniuse.com/#feat=datauri）在主要浏览器上显示对IE浏览器很少问题的支持。

    链接地址: http://www.djcxy.com/p/47035.html

    上一篇: Embedding Base64 Images

    下一篇: Getting Microsoft 10 Edge browser Mime Types php