CSS精灵和渐变

是否可以在单个精灵主图像上放置多个重复渐变？我有大约5个1px X 400 px渐变，可以合并以减少页面请求。这几乎是我减少对象请求的最后一个地方。我在搜索时没有看到任何技术。我自己的实验没有得到好的结果。CSS精灵和渐变

2010-10-26 J.T.

假设您应用背景渐变的所有区域都小于400像素高，您可以垂直平铺五个精灵来为您提供一个1x4000px的图像。

您可以通过指定垂直偏移量并设置background-repeat:repeat-x来应用精灵的相应部分。

垂直偏移将400 * (index of the sprite you want)：0px为先，400px为2，800px为第三等

2010-10-26 15:11:44 meagar

这是我没有任何批判性思维即时响应。这是否也会使用奇数宽度的精灵？ – 2010-10-26 15:25:53

所有的精灵必须具有相同的宽度，否则当它们重复时，它们之间会有空白空间。这不应该是一个问题，如果精灵的目的是水平平铺反正... – meagar 2010-10-26 16:17:29

我想使用径向渐变，但我想他们将必须是线性的。所以，真的，你可以逃避三个精灵 - 所有的静态背景图像，垂直线性渐变的精灵和水平线性渐变的精灵。很酷。谢谢。 – 2010-10-26 16:22:13

回答