代码之家 › 专栏 › 技术社区 › J.T.

CSS精灵和渐变

css-sprites

1

J.T. · 技术社区 · 14 年前

是否可以在单个sprite主图像上放置多个重复渐变?我有大约5个1px x 400 px的渐变,可以组合起来减少页面请求。这几乎是我最后一个减少对象请求的地方。在搜索过程中,我没有看到任何相关的技术。我自己的实验没有取得好的效果。

1 回复 | 直到 14 年前

1

user229044 14 年前

假设您要应用背景渐变的所有区域的高度都小于400px,您可以垂直平铺五个精灵,以获得一个1X400px的图像。

您可以通过指定垂直偏移和设置来应用sprite的适当部分。 background-repeat:repeat-x .

垂直偏移量为 400 * (index of the sprite you want) : 0px 首先, 400px 对于第二个, 800px 第三个,等等。

推荐文章

user1584751 · 精灵不显示

10 年前

Liam Joshua · 带有精灵的可点击图像

12 年前

user1434156 · CSS精灵:为几个类别设置精灵图像

12 年前

Jay RobG · HTML电子邮件中的图片?

12 年前