制作 CSS 精灵的工具？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/527336/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Tools to make CSS sprites?
提问by Simon_Weaver
Are there any good tools to make css sprites?
有没有什么好的工具可以制作css精灵？
IDEALLY I'd want to give it a directory of images and an existing .css file that refers to those images and have it create a big image optimized with all the little images AND change my .css file to refer to those images.
理想情况下，我想给它一个图像目录和一个引用这些图像的现有 .css 文件，并让它创建一个用所有小图像优化的大图像，并更改我的 .css 文件以引用这些图像。
At the least I'd want it to take a directory of images and generate a big sprite and the .css necessary to use each as a background.
至少我希望它采用图像目录并生成一个大精灵和使用每个作为背景所需的 .css。
Are there any good photoshop plugins or fully blown apps to do this?
是否有任何好的 Photoshop 插件或完全成熟的应用程序可以做到这一点？
采纳答案by Sophie Alpert
This will do 90% of the work for you: CSS Sprite Generator. You'll still need to edit the rules yourself, but the tool will give you the code fragments you need for the new CSS file.
这将为您完成 90% 的工作：CSS Sprite Generator。您仍然需要自己编辑规则，但该工具将为您提供新 CSS 文件所需的代码片段。
回答by Brian Grinstead
Instant Spriteis an in-browser CSS sprite generator I'm working on. It's really fast, but doesn't have quite as many features as some of the others. It currently only works in Firefox or Chrome, since it uses JavaScript FileReader and HTML Canvas to generate the sprites inside the web browser without uploads.
Instant Sprite是我正在开发的浏览器内 CSS 精灵生成器。它真的很快，但没有其他一些功能那么多。它目前仅适用于 Firefox 或 Chrome，因为它使用 JavaScript FileReader 和 HTML Canvas 在网络浏览器中生成精灵而无需上传。
回答by Jauder Ho
There is now Sprite Me by Steve Souders. Just tries it out and it seems to work pretty well.
现在有 Steve Souders 的 Sprite Me。只是尝试一下，它似乎工作得很好。
Here is the link http://spriteme.org/and here is the blog post announcing it.
这是链接http://spriteme.org/，这是宣布它的博客文章。
回答by Simon_Weaver
This looks promising :
这看起来很有希望：
Also i found this articlewhich has some useful information, and even some reader comments worth reading.
我还发现这篇文章有一些有用的信息，甚至一些读者评论也值得一读。
Also apparently google web toolkit has something - so if you're using that it might be worth checking out.
显然 google web toolkit 也有一些东西 - 所以如果你正在使用它，它可能值得一试。
回答by phoenix
回答by clyfish
ZeroSpritesis a CSS sprites generator aimed at area minimization using VLSI floorplaning algorithms.
ZeroSprites是一个 CSS 精灵生成器，旨在使用 VLSI 平面规划算法进行区域最小化。
回答by Scott Evernden
found this one pretty fasttho that 500K upload limit might be a pain. source code is available here
回答by Simon_Weaver
Not clear yet if it'll make it into the core ASP.NET framework but here's a Microsoft codeplex project for csssprites :
尚不清楚它是否会使其成为核心 ASP.NET 框架，但这里是 csssprites 的 Microsoft codeplex 项目：
http://aspnet.codeplex.com/releases/view/50869
http://aspnet.codeplex.com/releases/view/50869
if you like it - use it - or just like the idea then add a comment. I think this would be a great thing to have in the ASP.NET framework. Have not personally used it (I had to invent the wheel myself) but its got good reviews.
如果你喜欢它 - 使用它 - 或者只是喜欢这个想法然后添加评论。我认为这将是 ASP.NET 框架中的一件好事。没有亲自使用它（我不得不自己发明轮子），但它得到了很好的评价。
It includes the following components:
它包括以下组件：
- API for automatically generating sprites and inline images
- Controls and helpers which provide a convenient way of calling into the API
- 用于自动生成精灵和内嵌图像的 API
- 提供调用 API 的便捷方式的控件和助手
Features Added in Second Release:
第二版新增功能：
- A CSS linking control for Web Forms (selects the proper CSS file for the user's browser, but does not display an image)
- Using custom folder paths other than App_Sprites
- Changing the tiling direction of sprite images
- Merging the generated CSS with a user's own CSS
- Web 窗体的 CSS 链接控件（为用户的浏览器选择合适的 CSS 文件，但不显示图像）
- 使用除 App_Sprites 以外的自定义文件夹路径
- 改变精灵图像的平铺方向
- 将生成的 CSS 与用户自己的 CSS 合并
Features under consideration for future releases:
未来版本正在考虑的功能：
- Automatically selecting the most efficient sprite background colour
- Automatically minifying the rendered CSS
- Compiling against .NET 3.5
- 自动选择最有效的精灵背景颜色
- 自动缩小渲染的 CSS
- 针对 .NET 3.5 编译
回答by JeffZhnn
Tonttuis Adobe AIR based application which provides easy interface for creating powerful CSS Sprites images. You can specify FiledWidth and FieldHeight or sort images.
Create CSS Sprites Images with Tonttu Desktop Tool
Tonttu是基于 Adobe AIR 的应用程序，它为创建强大的 CSS Sprites 图像提供了简单的界面。您可以指定 FiledWidth 和 FieldHeight 或对图像进行排序。
使用 Tonttu 桌面工具创建 CSS 精灵图像
回答by John
Just use http://sprites.scherpontwikkeling.nl/it can generate sprites from website URL's as well...you can integrate your sprites after developing your website. It's very easy to use ;)
只需使用http://sprites.scherpontwikkeling.nl/它也可以从网站 URL 生成精灵……您可以在开发网站后集成您的精灵。它非常易于使用;)
