Справочник по CSS : Тематический указатель : Справочник по свойствам и атрибутам : Цвет и фон : background-repeat

Материал из Справочник Web-языков.

Перейти к: навигация, поиск


Содержание

[править] Атрибут background-repeat | Свойство backgroundRepeat

C помощью этого свойства задается будет ли повторяться фоновое изображение, установленное с помощью background-image, и если да, то по какой оси координат.

[править] Синтаксис

HTML { background-repeat : sRepeat }
Скрипты [ sRepeat = ] object.style.backgroundRepeat

[править] Возможные значения

sRepeat
Строка, которое может определять и принимать одно из следующих значений:
repeat Значение по умолчанию. Фоновый рисунок повторяется и по горизонтали, и по вертикали.
no-repeat Фоновый рисунок не повторяется.
repeat-x Фоновый рисунок повторяется по горизонтали.
repeat-y Фоновый рисунок повторяется по вертикали.

Значением по умолчанию является repeat. Свойство не наследуется.

[править] Замечания

С помощью значений repeat-x и repeat-y задается и горизонтальное, и вертикальное повторение фонового изображения. Соответственно, на экране создается набор изображений, в котором рисунки повторяются в заданном порядке.

Значение этого свойства можно задать в составном свойстве (background).

[править] Примеры

Следующие примеры иллюстрируют применение свойства backgroundRepeat и атрибута background-repeat.

В первом примере используется атрибут background-repeat для задания свойств повторения фоновому изображению.

<STYLE>
    .style1 { background-image:url(sphere.jpg);
        background-repeat:repeat }
    .style2 { background-image:url(sphere.jpeg);
        background-repeat:no-repeat }
</STYLE>
</HEAD>
<BODY>
<SPAN onmouseover="this.className='style1'"
onmouseout="this.className='style2'" onclick="this.className=''">
. . . </SPAN>

Во втором примере используется свойство backgroundRepeat, чтобы при наведении курсора мыши на объект, фоновое изображение стало повторяться.

<SPAN onmouseover="this.style.backgroundImage='url(sphere.jpeg)';
this.style.backgroundRepeat='repeat'">
:
</SPAN>

[править] Стандарты

Это свойство определено в Cascading Style Sheets (CSS), Level 1 (CSS1)

[править] Поддерживаемые браузеры

Internet Explorer 5.5, 6.0, 7.0, 8.0

Opera 7.0, 8.0, 9.2, 9.5

Safari 1.3, 2.0, 3.1

Firefox 1.5, 2.0, 3.0

[править] Ссылки на источники

https://msdn.microsoft.com/en-us/library/ms530721(VS.85).aspx

https://developer.mozilla.org/en/CSS/background-repeat

Добавить страницу в закладки:
РАЗРЕШАЕТСЯ перепечатывать и копировать информацию ТОЛЬКО ПРИ РАЗМЕЩЕНИИ ссылки на оригинал!
(<A href="https://www.spravkaweb.ru/">Справочник Web-языков</A>)
смотрим также
    смотрим также