使用CSS Sprite的优点是什么？如何利用它们？
CSS子画面将多个图像组合为一个图像，从而限制了浏览器必须进行的HTTP请求数量，从而缩短了加载时间。即使在新的HTTP/2协议下，情况仍然如此。
在HTTP/1.1下，每个TCP连接最多允许一个请求。使用HTTP/1.1，现代浏览器可以打开多个并行连接（介于2到8之间），但是它受到限制。使用HTTP/2，浏览器和服务器之间的所有请求都在单个TCP连接上多路复用。这意味着可以减少打开和关闭多个连接的成本，从而可以更好地使用TCP连接并限制客户端和服务器之间的延迟影响。这样就可以在同一TCP连接上并行加载数十个图像。
但是，根据基准测试结果，尽管HTTP/2比HTTP/1.1改进了50％，但在大多数情况下，子画面集的加载速度仍然比单个图像快。
要在CSS中使用Spritesheet，可以使用某些属性（例如） background-image， background-position 并 background-size 最终更改 background 元素的。
额外信息
background-image， background-position 并且 background-size 可以被用来利用spritesheet。
其他连结
CSS技巧解释的CSS精灵