1.在css代码中背景图片的写法。

.header {
    background-image: url(data:image/png;base64,iVBORw0...);
}

2.在html代码img标签中base64的写法。

<img src="data:image/gif;base64,base64,/9j/4AAQSkZJRgABAQEASABIAAD/4gIcSUNDX1BST0ZJTEUAAQE.....>


base64图片的优缺点
优点
无额外请求
可像单独图片一样使用,比如背景图片重复使用等
没有跨域问题,无需考虑缓存、文件头或者cookies问题
缺陷
css体积会极具变大,页面解析 CSS 生成的 CSSOM 时间增加
本来不到40KB的css文件,变成了200KB,请求时间页变长了。