先来看下下边这段代码：
JQAlAAACi5SPqcvtDyGYIFpF690i8xUw3qJBwUlSadmcLqYmGQu6KDIeM13beGzYWWy3DlB4IYaM
k+Dso2RWkFCfLPcRvFbZxFLUDTt21BW56TyjRep1e20+i+eYMR145W2eefj+6VFmgTQi+ECVY8iG
xcg35phGo/iDFwlTyXWphwlm1imGRdcnuqhHeop6UAAAIfkEBQoAAgAsEAACAAQACwAAAgWMj6nL
XAAh+QQFCgACACwVAAUACgALAAACFZQvgRi92dyJcVJlLobUdi8x4bIhBQAh+QQFCgACACwXABEA
DAADAAACBYyPqcsFACH5BAUKAAIALBUAFQAKAAsAAAITlGKZwWoMHYxqtmplxlNT7ixGAQAh+QQF
CgACACwQABgABAALAAACBYyPqctcACH5BAUKAAIALAUAFQAKAAsAAAIVlC+BGL3Z3IlxUmUuhtR2
LzHhsiEFACH5BAUKAAIALAEAEQAMAAMAAAIFjI+pywUAIfkEBQoAAgAsBQAFAAoACwAAAhOUYJnA
agwdjGq2amXGU1PuLEYBACH5BAUKAAIALBAAAgAEAAsAAAIFhI+py1wAIfkEBQoAAgAsFQAFAAoA
CwAAAhWUL4AIvdnciXFSZS6G1HYvMeGyIQUAIfkEBQoAAgAsFwARAAwAAwAAAgWEj6nLBQAh+QQF
CgACACwVABUACgALAAACE5RgmcBqDB2MarZqZcZTU+4sRgEAIfkEBQoAAgAsEAAYAAQACwAAAgWE
j6nLXAAh+QQFCgACACwFABUACgALAAACFZQvgAi92dyJcVJlLobUdi8x4bIhBQAh+QQFCgACACwB
ABEADAADAAACBYSPqcsFADs=
“>
其实“data:image/gif;base64,R0lGODlhJ……” 就是一张图片的Data URL，就是利用base64编码把图片数据翻译成标准ASCII字符。
等同于：
显示结果：
Data URL它现将图片转换成base64编码，以文本的形象随着文件加载。
再由浏览器在本地直接绘制图片，不是从服务器加载，所以节省了HTTP连接，起到加速网页的作用。
语法：
data:image/jpg; 声明数据协议及类型名称
base64, 编码形式为base64
/9j/4AAQSkZ…… base64编码结果
最后附上Data URL的生成方法(PHP)：
//php读取和保存base64编码的图片内容
header('Content-type:text/html;charset=utf-8');
//读取图片文件，转换成base64编码格式
//$image_file = './loading.gif';
$image_file = 'http://www.lrxin.com/images/loading.gif';
$image_info = getimagesize($image_file);
$base64_image_content = "data:{$image_info['mime']};base64," . chunk_split(base64_encode(file_get_contents($image_file)));
?>
需要注意：本方法适合于小图片，大图片就不要考虑了，另外IE8以下浏览器不支持这种方法。
用这种方法会加重客户端的CPU和内存负担，总之有利有弊。
IE8 之前的浏览器不支持 Data URL
简单的说，data类型的Url大致有下面几种形式。
data:,
data:text/plain,
data:text/html,
data:text/html;base64,
data:text/plain;charset=UTF-8;base64,
data:text/css,
data:text/css;base64,
data:text/javascript,
data:text/javascript;base64,
data:image/gif;base64,
data:image/png;base64,
data:image/jpeg;base64,
data:image/x-icon;base64,