Как наложить фон на картинку CSS

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

Например, если вы хотите добавить полупрозрачный фон на картинку, вы можете сделать это следующим образом:

.container {
  background-image: url("your-image.jpg");
  background-color: rgba(255, 255, 255, 0.5);
  background-blend-mode: lighten;
}

Здесь мы используем свойство background-image для указания изображения, на которое мы хотим наложить фон. С помощью свойства background-color мы добавляем полупрозрачный белый фон на эту картинку, указанную в формате RGBA, где последнее значение (0,5) определяет прозрачность фона.

Свойство background-blend-mode используется для управления смешиванием цвета фона с картинкой. В данном случае мы используем значение lighten, чтобы светлые цвета фона «осветляли» соответствующие цвета на картинке.