Как сделать фон картинкой на весь экран CSS

Для того, чтобы сделать фон картинкой на весь экран, необходимо использовать свойство background-image. Чтобы картинка была на всю ширину фона, нужно в объявлении прописать значение cover. Для примера создадим div, а для фона сайта нужно прописать свойство к тегу body.

Пример

Lorem Ipsum

HTML


<div class="bg-ex-image">Lorem Ipsum</div>

CSS


.bg-ex-image{
  background-image: url(image.jpg); /* Путь к картинке */
  background-size: cover; /* Растягиваем картинку  по ширине */
  background-repeat: no-repeat; /* Картинка фона без повторения */
  background-position: center; /* Позиция фона по центру */
}