本文主要是介绍运用Data URI scheme规范展现图片，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
先来个小演示，将如下代码全部复制，然后粘贴到Chrome或Firefox等浏览器的地址栏内并打开：
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAB4AQAAAAARHwt/AAAAq0lEQVR42u3VQQrEMAgFUMFrCV5d8FpC55tQaGYx4J9t00L6upCoSSvXOeT1t0NEM7Qnytl3+JooB8KZ98Tb8y9nOW/cJXrkN/GqJ5Zz1HfgNUrP/g4c4h3M73ymvgrPHmKks0xwmZdS7nUEiD3B2ayzEb/7MXSPsG4J525kIZl8nMeJ93kyrMo5oyC1W0p772neCCb9RaDcr0xDH+dr4q4nEHe8qd//yQ9/AIx/XBg3tuj2AAAAAElFTkSuQmCC可看到一张120X120的PNG格式图片，当然也可将上述代码置于 <img src="" /> 等HTML标签内。
这种规范就是Data URI scheme，见：https://en.wikipedia.org/wiki/Data_URI_scheme 它的格式如下：
data:[<MIME-type>][;charset=<encoding>][;base64],<data>所以上述代码中，“data:image/png;base64,”之后的文本是对图片字节流进行Base64后的字符串。
当然，根据“MIME-type”还可以展现更多其它格式的内容。
应用场景：
运用Data URI scheme规范展现图片可以减少网络请求，我认为特别适合用于一些体积较小的图片展现，如1X1的图片占位符等修饰性的图片。但也需要关注浏览器的兼容性以及Base64之后的字符串长度等问题。
这篇关于运用Data URI scheme规范展现图片的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
