CSS background-repeat 屬性

定義和用法

background-repeat 屬性設置是否及如何重復背景圖像。

默認地，背景圖像在水平和垂直方向上重復。

詳細說明

background-repeat 屬性定義了圖像的平鋪模式。

從原圖像開始重復，原圖像由 background-image 定義，并根據 background-position 的值放置。

另請參閱：

CSS 教程：CSS 背景

CSS 參考手冊：background-position 屬性

HTML DOM 參考手冊：backgroundRepeat 屬性

實例

body
  {
  background-image: url(stars.gif);
  background-repeat: repeat-y;
  }

親自試一試

提示和注釋

提示：背景圖像的位置是根據 background-position 屬性設置的。如果未規定 background-position 屬性，圖像會被放置在元素的左上角。

CSS 語法

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

屬性值

屬性值

值 描述
repeat 默認。背景圖像將在垂直方向和水平方向重復。
repeat-x 背景圖像將在水平方向重復。
repeat-y 背景圖像將在垂直方向重復。
no-repeat 背景圖像將僅顯示一次。
inherit 規定應該從父元素繼承 background-repeat 屬性的設置。

技術細節

默認值： repeat
繼承性： no
版本： CSS1
JavaScript 語法： object.style.backgroundRepeat="repeat-y"

更多實例

如何在垂直方向重復背景圖像
本例演示如何垂直地重復背景圖像。
如何在水平方向重復背景圖像
本例演示如何水平地重復背景圖像。
如何僅顯示一次背景圖像
本例演示如何僅顯示一次背景圖像。

瀏覽器支持

表格中的數字注明了完全支持該屬性的首個瀏覽器版本。

Chrome Edge Firefox Safari Opera
Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 3.5