CSS Sprite 生成器 : I have the bundled image

标签 css code-generation css-sprites

我有一张图片想用作 Sprite 。假设图像有 r x c 个大小相同的矩形,它们将用作背景。给定下图中的尺寸,我们如何为 R1C1RnCm 类的容器生成 css?使用的符号定义在图像下方。 css sprite grid

OH = 外部高度,OW = 外部宽度,
IH = 内部高度,IW = 内部宽度,
VG = 垂直装订线,HG = 水平装订线

附言我不确定我是否正确使用了 VG 和 HG 或者它们应该在图像中交换,如果是后者请忽略此问题。

最佳答案

我找到了 this tutorial ,它以非常简单的术语和逐步的方式解释了该技术。我将使用它并构建一个工具。然后我会在这里分享。

附言如果它提供具体的帮助和指导,我仍然会接受答案。

关于CSS Sprite 生成器 : I have the bundled image,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6031569/

相关文章:

javascript - Summernote 文本编辑器无法在生成 html 的简单 Bootstrap 页面中工作

code-generation - 您会考虑使用 CodeSmith 这样的代码生成器来编写哪些代码?

javascript - 模糊背景图像的特定部分

html - 如何将页脚中的内容居中

css - Glyphicons 不会出现在推特 Bootstrap 中

jquery - 使用 jquery 悬停 map 区域 Sprite

jquery - 通过链接替换 Sprite 图像

javascript - Angular 元素无法正确处理 "display: block"

java - Jaxb 生成的类使用 JAXBElement 而不是指定类型

iphone - iPhone/iPad 上的 CSS 元素(带有 Sprite )无法正确缩放