Для каких изображений подходит: для декоративных.

Для добавления фоновых изображений используется CSS-свойство background-image. Вместе с ним нужно прописать размеры изображения — width и height.

Например, на странице есть контейнер с классом .image-container:

<div class="image-container"></div>

Чтобы задать ему фон, нужно написать следующий код:

.image-container {
  background-image: url("images/keks.jpg");
  width: 600px;
  height: 400px;
}

Это минимальный набор CSS-правил. Часто фронтендеры используют дополнительные правила, чтобы изменить позицию и размеры изображения или запретить повтор фоновой картинки.

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

Его значения:

• scroll — значение по умолчанию. Фон прокручивается вместе с содержимым.
• fix — фон фиксируется.
• local — фон фиксируется с учётом содержимого элемента.

CSS-свойство background-position управляет расположением фона по осям X и Y, то есть по вертикали и горизонтали. Ему можно задавать значения, используя ключевые слова, процентные значения или конкретные величины, например, 100px. Ключевые слова для расположения по оси X:

• right — право;
• left — лево.

Ключевые слова для расположения по оси Y:

• top — сверху;
• bottom — снизу.

  Источник: htmlacademy.ru