纯粹出于好奇，哪些浏览器支持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
以下网页浏览器现在支持数据uri:
Gecko-based, such as Firefox, SeaMonkey, XeroBank, Camino, Fennec and K-Meleon Konqueror, via KDE's KIO slaves input/output system Opera (including devices such as the Nintendo DSi or Wii) WebKit-based, such as Safari (including on iOS), Android's browser, Epiphany and Midori (WebKit is a derivative of Konqueror's KHTML engine, but Mac OS X does not share the KIO architecture so the implementations are different), as well as Webkit/Chromium-based, such as Chrome Trident Internet Explorer 8: Microsoft has limited its support to certain "non-navigable" content for security reasons, including concerns that JavaScript embedded in a data URI may not be interpretable by script filters such as those used by web-based email clients. Data URIs must be smaller than 32 KiB in Version 8[3]. Data URIs are supported only for the following elements and/or attributes[4]: object (images only) img input type=image link CSS declarations that accept a URL, such as background-image, background, list-style-type, list-style and similar. Internet Explorer 9: Internet Explorer 9 does not have 32KiB limitation and allowed in broader elements. TheWorld Browser: An IE shell browser which has a built-in support for Data URI scheme
http://en.wikipedia.org/wiki/Data_URI_scheme#Web_browser_support
其他回答
更新:2017-01-10
所有主流浏览器现在都支持数据uri。IE从版本8开始也支持嵌入图像。
http://caniuse.com/#feat=datauri
以下网页浏览器现在支持数据uri:
Gecko-based, such as Firefox, SeaMonkey, XeroBank, Camino, Fennec and K-Meleon Konqueror, via KDE's KIO slaves input/output system Opera (including devices such as the Nintendo DSi or Wii) WebKit-based, such as Safari (including on iOS), Android's browser, Epiphany and Midori (WebKit is a derivative of Konqueror's KHTML engine, but Mac OS X does not share the KIO architecture so the implementations are different), as well as Webkit/Chromium-based, such as Chrome Trident Internet Explorer 8: Microsoft has limited its support to certain "non-navigable" content for security reasons, including concerns that JavaScript embedded in a data URI may not be interpretable by script filters such as those used by web-based email clients. Data URIs must be smaller than 32 KiB in Version 8[3]. Data URIs are supported only for the following elements and/or attributes[4]: object (images only) img input type=image link CSS declarations that accept a URL, such as background-image, background, list-style-type, list-style and similar. Internet Explorer 9: Internet Explorer 9 does not have 32KiB limitation and allowed in broader elements. TheWorld Browser: An IE shell browser which has a built-in support for Data URI scheme
http://en.wikipedia.org/wiki/Data_URI_scheme#Web_browser_support
大多数现代桌面浏览器，如Chrome, Mozilla和Internet Explorer都支持以数据URL编码的图像。但在一些移动浏览器中显示数据url存在问题:Android Stock Browser和Dolphin Browser无法显示嵌入的jpeg文件。
我建议您使用以下工具进行在线base64编码/解码:
编码为Base64格式 从Base64格式解码
检查“格式为数据URL”选项格式化为数据URL。
Can I use (http://caniuse.com/#feat=datauri)显示了对主要浏览器的支持，在IE上几乎没有问题。
