显示个别图像与显示图像拼贴的部分？

Question

我注意到一些网站使各种图像从图标到按钮的巨大拼贴。我能找到一个例子是Youtube。 Here's Youtube的“拼贴画”的例子。这些网站只显示该图片的一部分，而不是显示多个图片。

为了澄清，说一个网站有五个图标，每个10x10px。他们不是单独显示它们，而是创建一个50x10px拼贴画，加载一个图像并显示图像的五个单独实例，但每个实例只显示所需的部分。例如，图像1可能是从0px宽度开始的10x10px，另一个可能是从20px宽度开始的10x10px图像等。

与单独加载每个图像相比，这有什么好处？由于浏览器只加载一个图像，我想它的加载速度比多个图像快。这是真的？

Answer 1

你在说什么叫CSS sprites。 http://css-tricks.com/css-sprites/这个页面应该有你需要的所有信息。基本上，是的，速度更快 - 有更少的HTTP请求减慢页面速度。

这是关于同一主题的更多细节的以前的答案。 https://*.com/a/8050216/4317628