如何使用CSS精灵组合图像

在使用GTmetrix测试我的wordpress网站速度后，我通过YSlow获得了以下建议：

*使用CSS精灵组合图像 以下来自wamakity.com的图片应该使用CSS精灵组合成尽可能少的图片。

*添加过期标题 有9个静态组件没有很长的过期日期。

*减少HTTP请求 此页面有16个外部Javascript脚本。试着把它们合在一起

此页面有14个外部样式表。试着把它们合在一起

此页面有15个外部背景图像。尝试将它们与CSS精灵相结合

有人能帮忙吗？我是wordpress的新手，除了从这里，我似乎找不到任何其他方法来解决这个问题。

---

谢谢

我最喜欢的精灵生成器是

---

您只需将小图像拖放到窗口，下载spritesheet.png、stylesheet.css，然后在样式中更改这些图像的背景图像和背景位置属性。css

这一建议几乎肯定不适用于您的情况。CSS精灵是一种（过时的）技术，用于将图标图像合并到单个文件中。如果你对谷歌“css精灵”感兴趣，你会发现大量的资源，比如这篇文章：感谢你的快速回复！我已经试过了，但是CSS输出的主标题不在我的“style.CSS”中，正如许多教程所说的那样。我看到如下内容。sprite{background image:url（spritesheet.png）；background repeat:no repeat；display:block；}.sprite-12-2{width:20px；height:20px；background position:-5px-5px；}.sprite-2468fa3xxx84{width:51px；height:51px；background position:-35px-5px；}。。。。