CSS Sprites 自动化答案

【问题标题】：CSS Sprites AutomationCSS Sprites 自动化
【发布时间】：2011-09-26 15:46:26
【问题描述】：

最近我处理了 CSS sprites。它工作正常。

我创建了一个精灵，.css 文件和 html 结构。好像

.sprites{
         background-image:url('../img/sprite.png');
         background-color:transparent;
         background-repeat:no-repeat;
         height:44px;
         width:44px;
  }
.pic1            {background-position:0 0;}
.pic2            {background-position:-44px 0;}



 <div class="outer"><div class="sprites ${image}"></div></div>

${image} 在条件为真时选择类。

我手动创建精灵、css 和 html。我本可以使用生成器，但代码是一样的。

有没有一种方法可以自动创建精灵和 css，例如爪哇？如果有一个包含 50 个图像的文件夹，那么程序（我猜必须编写）将创建一个精灵和相关的 css 属性本身。这可能吗？你听说过这样的程序吗？

【问题讨论】：

我还没有听说过可以自动完成所有操作的程序，但是我使用了 Sprite Cow 来为您生成位置值 - 这就是您要找的吗？
很遗憾没有。生成器可以完成工作，是的，但我真的在寻找一个程序或脚本来检测我文件夹中的图像，创建一个精灵和相关的 css 属性。
你的问题对我来说有点太模糊了。您应该至少指定一种编程语言，并为其添加标签，以便更多人能够帮助您。
stackoverflow.com/questions/527336

标签： css automation css-sprites sprite

【解决方案1】：

It is possible.

【讨论】：

它只是检测客户端源代码的图像，不是吗？
您使用单独的图像创建“普通”样式表，它会为您转换它们。类名必须在某个地方形成，因此仅从文件开始并且没有样式表意味着您必须适当地命名您的图像或更改输出样式表中的每个类名/ID。
是的，好吧。我已经完成了这项工作，并且有很多生成器。我正在寻找检测文件夹中所有图像的代码（服务器端的那种）。无论如何，谢谢你。
@Litek 关心为该链接添加一些上下文？如果不对您要链接的内容进行一些解释，您的回答本身并没有太大帮助。

【解决方案2】：

如果您使用的是 .net，请查看 http://www.RequestReduce.com。它不仅自动创建 sprite 文件，而且还通过 HttpModule 即时完成，同时合并和缩小所有 CSS。它还使用量化和无损压缩优化 sprite 图像，并使用 ETags 和 Expires 标头处理生成文件的服务，以确保最佳浏览器缓存。设置很简单，只涉及一个简单的 web.config 更改。请参阅我的blog post，了解 Microsoft Visual Studio 和 MSDN 示例库对它的采用情况。

您不需要将图像排列在任何特定文件夹或格式中，因为 RequestReduce 通过 HTTP 提取 CSS 和图像。因此，您的 css 和 sprite 甚至可以托管在其他地方并且可以正常工作。

【讨论】：

【解决方案3】：

此工具可能对稍后提及此内容的人有所帮助。 http://www.spritecss.com/

【讨论】：