网页中会有许多的小图标及图片,会向服务器去请求文件,有多个小图标都要一个一个的去请求过来,这样会让服务器的压力过大,也大大降低页面的加载速度。因此,为了有效减少服务器接收和发送请求的次数,提高页面的加载速度,出现了CSS精灵图技术(也称CSS Sprites,CSS雪碧)。

精灵图生成器允许您将多张图片合并成一张。在您的网页代码中,通过CSS的backgroud属性,告诉浏览器读取精灵图指定位置和指定大小的图像,并将图像显示在在页面上。


可拖放图片到这


px
px (仅逐行扫描模式有效)
排列方式:
图片列表
CSS代码
HTML代码