CSS свойство background-repeat

Определение и применение

CSS свойство background-repeat устанавливает, как будет повторяться фоновое изображение. По умолчанию фоновое изображение повторяется по горизонтали и вертикали.

Поддержка браузерами

Свойство	Chrome	Firefox	Opera	Safari	IExplorer	Edge
background-repeat	1.0	1.0	3.5	1.0	4.0	12.0

CSS синтаксис:

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

JavaScript синтаксис:

object.style.backgroundRepeat="repeat-y"

Значения свойства

Значение	Описание
repeat	Фоновое изображение будет повторяться как по вертикали, так и по горизонтали. Это значение по умолчанию.
repeat-x	Фоновое изображение будет повторяться по горизонтали (по оси x).
repeat-y	Фоновое изображение будет повторяться по вертикали (по оси y).
no-repeat	Фоновое изображение не будет повторяться.
initial	Устанавливает свойство в значение по умолчанию.
inherit	Указывает, что значение наследуется от родительского элемента.

Версия CSS

CSS1

Наследуется

Нет.

Анимируемое

Нет.

Пример использования

<!DOCTYPE html>
<html>
<head>
<title> Свойство background-repeat</title>
<style> 
.primer {
background-image:url("smile.png"); /* задаём изображение для заднего фона */
background-position:center; /* задаём положение изображения */
background-repeat:repeat-y; /* повторяем изображение вертикально */
background-color:khaki; /* задаём цвет заднего фона */
height:300px; 
width:300px;
}
</style>
</head>
	<body>
		<div class = "primer"></div>
	</body>
</html>

CSS свойства