前端小白工具篇（一）雪碧图CssSprite

本文主要介绍前端的工具CssSprite雪碧图。当图片数量较多，而且搭配合理的情况下，可以有效地提升网页速度；另外，借助 CSS sprite 的特性可以进行图片提前加载处理。

####CssSprite雪碧图的优点

• 减少请求数
• 图片总 size减少
• 提前加载图片

####CssSprite雪碧图的缺点

• 不建议大图片合并，建议类似图片合并

####CssSprite雪碧图如何使用
1.下载雪碧图生产工具CssSprite
下载地址：http://download.csdn.net/download/qq_38209578/10158005
（如果上述的地址无法访问，请找度娘~~）

2.如上图所示选择多张图片

Tips:请注意自己的css中文件夹是否正确，可修改，图片文件名称即该雪碧图的公共类名.img可修改

3.在确认属性无误的情况下，点击右上角生成雪碧图，即可得到一张img.png
4.雪碧图的调用
效果图如下：

.css样式(将底部生成的css代码复制到外部的.css样式文件)