在 CSS 中重复具有任意偏移量的背景

Question

好吧，我想知道我们是否可以在 CSS 中使用任意偏移重复背景？我的意思是我们可以在每次渲染时“移动”一个 tile x 和 y 像素吗？用例可以是马赛克、图案和很多东西，甚至可以使用等距平铺来实现。

例如，如果我有一个 10px x 10px 的图块

每次重复瓷砖时，我想将它从顶部移动 10px，所以我将实现的是

[//]
    [//] 
        [//]
            [//]

那么是否有任何现有的解决方案，或者 Canvas 只是可行的方法（在画布中进行，然后将其用作背景）

Answer 1

从 CSS3 开始，这不能仅使用 CSS 样式来完成。重复图案在 x（水平）方向、y（垂直）方向、同时在两个方向或两个方向（单个图像）上都是周期性的。