CSS精灵图像+背景重复其中的一部分

Posted 2023-02-16

【中文标题】CSS精灵图像+背景重复其中的一部分

【英文标题】：CSS sprite image + background-repeat a part of it

【发布时间】：2011-07-30 20:15:14

【问题描述】：

我可以在背景中重复图像的 部分 [它在 CSS 精灵图像中] 吗？！

例如：

背景位置：-13px 顶部； 背景重复：重复-y；

因为我重复了整个精灵图像...

【参考方案1】：

如果您将图像并排放置在一个非常宽的精灵中，您将能够使用repeat-y。如果您需要使用 repeat-x，您可以将 sprite 中的图像放在一起。

【讨论】：

你所说的“宽”是什么意思？！

@Waseem 假设你在 sprite 中有 20 张图片，每张图片的宽度为 100px，那么 sprite 的宽度将为 200px。

@Waseem - 这是一个帮助支持@Gareth 解释的链接 -> CSS background-repeat