HTML或CSS代码以正确重复偏斜模式

Question

我有一个模式，该模式想在我的网站上用作背景，且形状偏斜。我想知道是否有HTML或CSS代码将第二个背景向左移，以隐藏白色get并使它看起来更好。预先谢谢你。

倾斜模式

Answer 1

创建一个水平移动的新图像，以便使用矩形图案。我创建了图像，但由于它没有原始图像，效果不佳。您可以使用它。

您的新图片在这里

div {
  background: url(https://i.stack.imgur.com/pvap7.png);
}

<div style=width:1000px;height:1000px></div>

---

创建图片的说明

我使用程序GIMP（http://gimp.org/）。它是免费的。

1. 使用模糊选择工具和Delete键删除白色区域（使其透明）。如果未启用透明度，请右键单击图层并启用它。
2. 复制图像（按Ctrl-C，然后按Ctrl-V）
3. 使用移动水平移动它，因此两个副本之间没有透明区域。
4. 按Ctrl-H（固定浮动层）
5. 右键单击顶层，然后合并
6. 裁剪图像（ Image→自动裁剪图像）
7. 将其裁剪到中心（图像→画布大小…），设置宽度264（一个“块”的宽度），然后单击 Center 按钮
8. 手动删除白色像素
9. 将其导出为PNG（在 File 菜单中）
10. 使用它