一个png 图片怎么会有多个图标，怎么使用

Question

Answer 1

这就是大家一般所说的CSS雪碧图，英文名字叫做CSS Sprite

用法以及这样做的目的和原理百度百科已经有说明了，不多说了，给你链接

CSS Sprite

Answer 2

通过设置background的位置和大小来获取png图标

Answer 3

精灵图，根据每个小图片左上角的位置，进行截取。你们设计还是比较负责的

Answer 4

使用 background-position处理即可

Answer 5

雪碧图，可以使用 background-size + background-position 去修改。

Answer 6

这个有很多小图标的png图叫CSS雪碧图。
一个站点如果会用到很多小图标，最好用PS把这些小图标整理排版到一个大的png上。
整理到一个png上，只从服务器上请求一次图标就可以（因为所有图标都在这一张png上），减少了页面对服务器的请求次数，性能就提升了。
至于用法，跟单一一个小图标用法一样，设定背景图就好，然后量出小图标在大png上的位置（距离上边和左边的尺寸），设定background-position。

Answer 7

使用background-position获取小图标在雪碧图中的位置即可；