如何“重复-x”由 Compass 生成的精灵

发布于 2024-12-08 15:01:30 字数 793 浏览 0 评论 0原文

我在 Rails 3.1 应用程序的 assets/images 中有一个 gradient 目录。下面是我使用 Compass 从这些图像创建精灵的代码：

 $gradient-repeat: repeat-x;
 @import "compass";
 @import "gradient/*.png";
 body > header > nav {
   clear: both;
   @include gradient-sprite(red-menu);
 }

我的问题是，即使我明确告诉 Compass 我希望水平重复我的背景，它仍然会生成以下 CSS：

 body > header > nav {
   clear: both;
   background-position: 0 -207px;
   height: 34px;
 }
 .gradient-sprite, body > header > nav {
   background: url(/assets/gradient-sbe06665f77.png) no-repeat;
 }

所以我的渐变不会重复水平地。

我在 Gemfile 中使用 Compass gem 的 3.1 分支。

现在，我可以简单地添加一个 background-repeat: Repeat-x; 到我的代码中并覆盖 Compass 为我生成的内容，但我觉得这不是 Rails 的做事方式。

任何帮助将不胜感激。

原文

I have a gradient directory in my assets/images in a Rails 3.1 application. Here's the code I use to create a sprite from those images using Compass:

 $gradient-repeat: repeat-x;
 @import "compass";
 @import "gradient/*.png";
 body > header > nav {
   clear: both;
   @include gradient-sprite(red-menu);
 }

My problem is that even though I explicitly tell Compass that I want my background to be repeated horizontally, it still produces the following CSS:

 body > header > nav {
   clear: both;
   background-position: 0 -207px;
   height: 34px;
 }
 .gradient-sprite, body > header > nav {
   background: url(/assets/gradient-sbe06665f77.png) no-repeat;
 }

and so my gradient does not get repeated horizontally.

I'm using the 3.1 branch of the Compass gem in my Gemfile.

Now, I could simply add a background-repeat: repeat-x; to my code and override what Compass has generated for me, but that I feel is not the Rails way of doing things.

Any help would be greatly appreciated.

分享到QQ

分享到微博