Question

tl; dr：Sass目前有什么东西可以做这样的事情，拍摄ImageMagick生成的图像并将其放入图像文件夹并自动指定其宽度和高度？

h2.anthony {
    /* image replacement CSS here */
    @magick-image: "convert -fill blue -font Candice -pointsize 72 label:Anthony header-anthony.png";
}

（ImageMagick命令基于此示例：http://www.imagemagick.org/Usage/text/#label）

结果CSS：

h2.anthony {
    /* image replacement CSS here */
    background: url(img/header-anthony.png) no-repeat;
    width: 275px;
    height: 79px;
}

我必须使用图片，而不是网页字体，Cufon，sIFR等，因为网站是中文和中文字体很大。

背景故事：

我正在开发一个新网站，其中包含许多页面中的大量文本，其标题文本应以特定字体显示，并带有渐变效果。

现在，即使我使用CSS精灵并将所有带有所需效果的标题文本放入同一图像中，我仍然需要测量每一行的宽度并手动将其输入到我的样式表中。随着页面的添加或删除或最长文本行的长度发生变化，它会变得更加麻烦。

我正在寻找自动化方法。我已经想出了如何使用ImageMagick重新创建效果，所以我可以使用一个命令生成每个标题图像，但我仍然需要自己测量图像的宽度。

Answer 1

恰好有一个Compass扩展程序可以让你使用ImageMagick。我从来没有用它，但它看起来很有趣。

https://github.com/StanAngeloff/compass-magick

使用Sass自动生成文本图像和相应的CSS？

1 个答案: