CSS Sprites （CSS精灵）

时间：2011-05-27 来源：曾祥展

CSS Sprites原理
CSS Sprites其实就是把网页中一些背景图片整合到一张图片文件中，再利用CSS的“background-image”，“background-repeat”，“background-position”的组合进行背景定位，background-position可以用数字能精确的定位出背景图片的位置。

CSS Sprites优点
1.利用CSS Sprites能很好地减少了网页的http请求，从而大大的提高了页面的性能，这也是CSS Sprites最大的优点，也是其被广泛传播和应用的主要原因；
2.个人认为能CSS Sprites能减少图片的字节，我曾经比较过多次3张图片合并成1张图片的字节总是小于这3张图片的字节总和。

css:

background:url(../Images/bg.gif) no-repeat -14px -90px;

工具：腾讯互联网用户体验设计部

Ghost 开发的

下载链接：css精灵使用方法：进入

相关阅读更多 +