Урок 110 із 239
46%
Повторення фонового зображення в CSS
Вивчаємо, як керувати повторенням фонового зображення за допомогою властивості background-repeat.
Повторення фонового зображення в CSS
За замовчуванням фонове зображення в CSS повторюється по горизонталі та вертикалі, заповнюючи весь доступний простір.
Таке повторення називається замощенням фону. Воно дозволяє невеликим зображенням створювати великий фон сторінки.
❗ Важливо:
За замовчуванням використовується значення background-repeat: repeat.
- repeat — повторення по горизонталі та вертикалі (значення за замовчуванням).
- repeat-x — повторення тільки по горизонталі.
- repeat-y — повторення тільки по вертикалі.
- no-repeat — без повторення зображення.
📌 Завдання:
- №1. Встановіть зображення як фон для body.
- №2. Додайте background-repeat: repeat та перевірте результат.
- №3. Спробуйте значення repeat-x, repeat-y та no-repeat.
💡 Показати підказку
Якщо потрібно розмістити одне велике фонове зображення без повторення, використовуйте background-repeat: no-repeat.
✅ Показати відповідь
body {
background-image: url("/img/bg.png");
background-repeat: repeat;
}