Top.Mail.Ru
Ответы

Как слелать полупрозрачный фон в header? Пример внутри.

На скринах видно, что синий фон просвечивает до страницы прокручиваемой. Текст, картинки видно через фон. При этом заголовки nav стоят передним планом и не прозрачны.
Как такое закодить?

По дате
По рейтингу
Аватар пользователя
Новичок
6лет

.png или background: rgba как написали ранее.
background: rgba( 255, 0, 0, 0.5); красный с прозрачностью 50%

Аватар пользователя
Оракул
6лет

rgba в css

Аватар пользователя
Мудрец
6лет

Открываем гугл, вводим запрос и за секунду получаем ответ:

Современный подход гораздо проще и нагляднее вышеприведенных методов и состоит в использовании для цвета и фона формат RGBA. Первые три буквы знакомы многим и расшифровываются как red, green, blue (красный, зеленый, синий), последняя символизирует собой альфа-канал и задает прозрачность элемента. Формат записи такой.

background-color: rgba(r, g, b, a);

В скобках вместо букв ставится значение компонента цвета, его можно посмотреть в любом графическом редакторе, последнее же значение устанавливает прозрачность и совпадает со значением свойства opacity.

Для элемента задаем такие значения:

background-color: rgba(0, 120, 201, 0.7);
Первые 3 параметра определяют цвет (его можно подобрать. Это не сложно). Последний параметр - прозрачность.

Аватар пользователя
Мудрец
6лет

opacity: .5;

Аватар пользователя
Просветленный
6лет

проще простого в css. могу сделать за плату, любые действия с сайтом.