Свойство background-repeat
Описание
Определяет, как будет повторяться фоновое изображение, установленное с помощью свойства background-image.
Синтаксис
background-repeat: repeat-x | repeat-y | [repeat | space | round | no-repeat]{1,2};
Значение | Описание |
no-repeat | Фоновое изображение не повторяется. |
repeat | Фоновое изображение будет повторяться по горизонтали и вертикали. Аналогично repeat repeat. |
repeat-x | Фоновый рисунок будет повторяться только по горизонтали. Аналогично repeat no-repeat. |
repeat-y | Фоновый рисунок будет повторяться только по вертикали. Аналогично no-repeat repeat. |
space | Изображение повторяется столько раз, чтобы полностью заполнить область. Если это не удаётся, между картинками будет добавляется пустое пространство. |
round | Изображение повторяется так, чтобы в области поместилось целое число рисунков. Если это не удаётся сделать, то фоновые рисунки будут масштабируются. |
Пример
<!DOCTYPE html>
<html lang='ru'>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<title>Document</title>
</head>
<body>
<style>
#im-t1 {
background-image: url('/files/images/regular/shar2.png');
background-color: #93c1f7 !important;
background-repeat: no-repeat;
height: 100%;
width: 80vw;
background-repeat: repeat;
}
</style>
<div class='v2'>
<div id='im-t1'></div>
</div>
</body>
</html>
Читайте также
Свойство border-top-left-radius
Устанавливает радиус скругления левого верхнего угла рамки.Если рамка не задана, то скругление та...
Пустые элементы
Представляет пустые элементы, иными словами такие, которые не содержат дочерних элементов, текста...
currentColor
Ключевое слово <span class='samp>currentColor</span> соответствует значению...
Стиль посещенных ссылок
Псевдокласс :visited применяется к ссылкам, уже посещённым пользователем, и задаёт для них стилев...
Функция linear-gradient()
Функция добавляет линейный градиент к фону элемента. Она выступает значением свойства <span cl...