如何使用 CSS 垂直和水平重复背景图像？

在本文中，我们将讨论 CSS 的背景图像重复属性。此外，我们将讨论如何在水平和垂直方向重复背景图像。

CSS 中的background-repeat 属性用于水平和垂直重复背景图像。它还决定是否重复背景图像。

Background-repeat：此属性用于水平和垂直重复背景图像。如果最后一张图像不适合浏览器窗口，则将对其进行剪裁。

句法

background-repeat: repeat|repeat-x|repeat-y|
no-repeat|initial|inherit;

示例 1：让我们水平重复图像。在这里，我们将使用我们之前使用的相同属性。

repeat-x这个属性用于水平重复背景图像。

句法：

element {
   background-repeat: repeat-x;
}

HTML

输出：正如您在输出中看到的，图像现在水平重复。

示例 2：现在让我们垂直重复图像。 repeat-y属性用于设置仅垂直重复的背景图像。

句法：

element {
   background-repeat: repeat-y;
}

HTML

输出：现在图像垂直重复。