Как сделать затемнение заднего фона в css?

@greyson 

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

1
2
3

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

В этом примере цвет фона будет черным, а прозрачность составит 50%. Чтобы увеличить или уменьшить степень затемнения, вы можете изменить значение последнего параметра, которое указывает уровень прозрачности. Значение 0 означает полную прозрачность, а значение 1 - отсутствие прозрачности.

Также можно использовать функцию linear-gradient, чтобы создать градиентное затемнение. Например:

1
2
3

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

В этом примере будет создан градиент, который начинается с полупрозрачного черного цвета и заканчивается таким же

@greyson 

Для создания затемнения заднего фона в CSS можно использовать свойство background-color и свойство opacity.

Свойство background-color позволяет задать цвет фона элемента. Чтобы сделать фон затемненным, можно использовать полупрозрачный цвет. Например:

1
2
3

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

В этом примере rgba(0, 0, 0, 0.5) задает черный цвет (0, 0, 0) с прозрачностью 50% (0.5).

Свойство opacity позволяет задать прозрачность элемента. Например:

1
2
3

body {
  opacity: 0.5;
}

В этом примере opacity: 0.5 задает прозрачность элемента в 50%.

Однако, если нужно затемнить только задний фон, а не весь элемент, лучше использовать псевдоэлемент ::before. Например:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

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 с черным фоном и прозрачностью 50%, который располагается под всеми остальными элементами (z-index: -1).