base64,雪碧图CSS Sprite,直接使用图片

base64：

• 这类图片不能与其他图片以CSS Sprite的形式存在，只能独行
• 这类图片从诞生之日起，基本上很少被更新
• 这类图片的实际尺寸很小（几K-10KB，小于10KB）
• 这类图片在网站中大规模使用

1.CSS Sprite:
可以减少文件体积和服务器请求次数，从而提高效率
一般情况下，你需要保存为PNG-24的文件格式
可以设计出丰富多彩的颜色图标

只在一个页面中用到的小图标可以使用这种方法

2.font + html
灵活性：轻松地改变图标的颜色或其他css效果
可扩展：改变图标的大小，就像改变字体大小一样容易
矢量性：图标是矢量的，与像素无关。缩放图标不会影响清晰度。
兼容性：字体图标支持所有现代浏览器（包括ie6）
本地使用：通过添加定制字体到您的本地系统，你可以在各种不同的设计和编辑应用程序中使用它们
工具下载(IcoMoon)https://icomoon.io
免费的图标，免费的应用程序（400+免费字体图标）
构建只包含您需要的图标
导入您的矢量图（SVG字体），而不会被上传到服务器
方便管理图标，除了生成字体，还可以生成SVG

只所有页面中用到的小图标可以使用这种方法
3.font + css
伪元素：创建一个虚假的元素，并插入到目标元素内容之前

只所有页面中用到的小图标可以使用这种方法

直接使用图片：

商品图片，大的背景图片，logo图片，品牌图片