Как затемнить задний фон CSS

Чтобы затемнить задний фон (background) страницы или определенного элемента при помощи CSS, используйте свойство background-color и задайте ему полупрозрачный цвет с помощью функции rgba(). Это позволит вам задать цвет фона с прозрачностью (альфа-каналом), который будет создавать эффект затемнения.

Например, чтобы затемнить задний фон страницы на 50%, используйте следующий CSS-код:

body {
  background-color: rgba(0, 0, 0, 0.5);
}

Здесь мы задали цвет фона черный rgb(0, 0, 0) и прозрачность 0.5. Чем больше значение прозрачности (от 0 до 1), тем более затемненным будет фон.

Если вы хотите затемнить фон только для определенного элемента, а не для всей страницы, примените этот же код, но поместите его в CSS-правило для нужного элемента. Например:

.my-element {
  background-color: rgba(0, 0, 0, 0.5);
}

Здесь .my-element — это класс элемента, фон которого нужно затемнить.

Обратите внимание, что с помощью альфа-канала вы можете задать не только полупрозрачный цвет, но и полностью прозрачный. Для этого задайте значение прозрачности равным 0.