精灵图指的是把一个网页中需要使用的多个图片整合在一张大图中,这样打开网页时,只需要加载一张图片的资源,减少图片访问次数,降低服务器的压力,从而提高网页加载速度。

使用方式: 通过背景图片的方式引入精灵图,通过background-size属性调整图片大小,通过background-poisition属性调整图片显示区域定位 。
logo.png:精灵图的含义及使用方式

精灵图的含义及使用方式
运行结果:
精灵图的含义及使用方式
鼠标移入后:
精灵图的含义及使用方式

相关文章: