HTML - DOM Style 对象 backgroundRepeat 属性

HTML DOM Style 对象 backgroundRepeat 属性设置或返回背景图像的重复方式。

语法

以下是获取或设置 backgroundRepeat 属性的语法。

设置 backgroundRepeat 属性

object.style.backgroundRepeat= "repeat | repeat-x | repeat-y | no-repeat | initial | inherit";

获取 backgroundRepeat 属性

object.style.backgroundRepeat;

属性值

值	描述
repeat	这是默认值，在水平和垂直两个轴上重复背景图像。
repeat-x	在 x 轴（水平方向）上重复背景图像。
repeat-y	在 y 轴（垂直方向）上重复背景图像。
no-repeat	不允许图像重复。
initial	用于将此属性设置为其默认值。
inherit	用于继承其父元素的属性。

返回值

返回一个字符串值，表示背景图像的重复方式。

HTML DOM Style 对象“backgroundRepeat”属性的示例

以下示例说明了backgroundRepeat属性的不同属性值。

将背景图像设置为不重复

以下示例将背景图像设置为重复和不重复。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>
        HTML DOM Style Object backgroundPosition Property
    </title>
    <style>
        body {
            background: #f3f3f3 url('/html/images/logo.png');
            height: 300px;
            width: 300px;
        }
    </style>
</head>
<body>
    <p>Click to repeat or stop repeating.</p>
    <button onclick="norepeat()">No Repeat</button>
    <button onclick="repeat()">Repeat</button>
    <script>
        function norepeat(){
            document.body.style.backgroundRepeat="no-repeat";
        }
        function repeat(){
            document.body.style.backgroundRepeat="repeat";
        }
    </script>
</body>
</html>

在两个轴上都重复

以下示例将背景图像设置为水平和垂直重复。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>HTML DOM Style Object backgroundRepeat Property</title>
    <style>
        body {
            background: #f3f3f3 url('/html/images/logo.png') no-repeat;
            height: 300px;
            width: 300px;
        }
    </style>
</head>
<body>
    <p>Click to repeat on x-axis.</p>
    <button onclick="repx()">Repeat</button>
    <p>Click to repeat on y-axis.</p>
    <button onclick="repy()">Repeat</button>
    <script>
        function repx(){
            document.body.style.backgroundRepeat="repeat-x";
        }
        function repy(){
            document.body.style.backgroundRepeat="repeat-y";
        }
    </script>
</body>
</html>

支持的浏览器

属性
backgroundRepeat	是 1	是 12	是 1	是 1	是 3.5

html_dom_style_object_reference.htm

打印页面