• 精灵图的使用
  主要借助于背景位置来实现 background-position: x y ; 里面分别填入x轴 和y轴坐标
• 字体图标
  主要适用场景小图标 简单的图标
  
• 字体图标的使用

先打开下载的字体文件里面的 demo.html 复制字体后边的小框 

字体声明 
        @font-face {
            font-family: 'icomoon';
            src: url('fonts/icomoon.eot?lck2wb');
            src: url('fonts/icomoon.eot?lck2wb#iefix') format('embedded-opentype'), url('fonts/icomoon.ttf?lck2wb') format('truetype'), url('fonts/icomoon.woff?lck2wb') format('woff'), url('fonts/icomoon.svg?lck2wb#icomoon') format('svg');
            font-weight: normal;