background-repeat

用於控制元素背景圖片重複方式的通用類別。

Class Styles

bg-repeat

background-repeat: repeat;

bg-repeat-x

background-repeat: repeat-x;

bg-repeat-y

background-repeat: repeat-y;

bg-repeat-space

background-repeat: space;

bg-repeat-round

background-repeat: round;

bg-no-repeat

background-repeat: no-repeat;

範例（Examples）

使用 bg-repeat 通用類別在垂直和水平方向重複背景圖片：

<div class="bg-[url(/img/clouds.svg)] bg-center bg-repeat ..."></div>

使用 bg-repeat-x 通用類別僅在水平方向重複背景圖片：

<div class="bg-[url(/img/clouds.svg)] bg-center bg-repeat-x ..."></div>

使用 bg-repeat-y 通用類別僅在垂直方向重複背景圖片：

<div class="bg-[url(/img/clouds.svg)] bg-center bg-repeat-y ..."></div>

使用 bg-repeat-space 通用類別重複背景圖片且不裁剪：

<div class="bg-[url(/img/clouds.svg)] bg-center bg-repeat-space ..."></div>

使用 bg-repeat-round 通用類別重複背景圖片且不裁剪，必要時會拉伸以避免間隙：

<div class="bg-[url(/img/clouds.svg)] bg-center bg-repeat-round ..."></div>

使用 bg-no-repeat 通用類別防止背景圖片重複：

<div class="bg-[url(/img/clouds.svg)] bg-center bg-no-repeat ..."></div>

在 background-repeat 通用類別前面加上像 md: 這樣的中斷點變體，讓該通用類別只在中型螢幕尺寸及以上時套用：

<div class="bg-repeat md:bg-repeat-x ...">  <!-- ... --></div>

在變體文件中了解更多關於使用變體的資訊。