Для того, чтобы создать затемнение фона в CSS, можно использовать свойство background-color
с некоторым значением прозрачности. Например, чтобы добавить затемнение фона на 50%, можно использовать следующий CSS-код:
body::before {
content: "";
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
z-index: -1;
}
В этом примере мы создали псевдоэлемент ::before
и устанавливаем для него свойства position: fixed;
, top: 0;
, left: 0;
, width: 100%;
, height: 100%;
, чтобы он охватывал всю область экрана.
Затем мы задали цвет фона с помощью свойства background-color
. Значение rgba(0, 0, 0, 0.5)
означает черный цвет (0, 0, 0
) с прозрачностью 50% (0.5
). Меняя эту прозрачность, можно регулировать уровень затемнения.
Наконец, мы задали z-index: -1;
, чтобы псевдоэлемент оставался под всем остальным контентом на странице.