Как сделать панель меню прозрачной и сместить на картинку?

Question

[starmi81]

Мучаю тему для wordpress NEVE (https://ru.wordpress.org/themes/neve/).
Хочу разместить блок меню, который с логотипом и т.д., на картинке и прозрачным фоном.
Понимаю, что цвет фона нужно перевести в RGBA и задать степень прозрачности от 0 до 1.
Но столкнулся со сложностью: как разместить эту панель на картинке, а картинку сделать по размеру экрана?

Comments

[Froggyweb]

ну вот ничего же не понятно.

Хочу разместить блок меню, который с логотипом и т.д., на картинке и прозрачным фоном.

Как разместить эту панель на картинке, а картинку сделать по размеру экрана

1. ничего не понял но может position: fixed?
зы в теме все красиво, если у тебя не так надо выкладывать проблему в песочницу, либо ссылку на проблему....

[starmi81]

Froggyweb, Спасибо за ответ.
Действительно выразил мысль не совсем корректно. Извиняюсь.
Отображается всё так как и нужно.
В моей задумке нет ни чего нового, часто встречается это решение.
По пунктам о моей задумке:
1. Панель с меню сама шапка (Header) должна быть прозрачной.
2. Картинка должна занимать 100% экрана
3. Под header должна просвечивать картинка.
Пример реализации на этой картинке:

Еще раз извиняюсь, что не достаточно понятно изложил мысль.

[Froggyweb]

меню - position fixed
блоку - min-height: 100 vh
для позиционирования использовать z-index
Найти похожий блок не проблема и посмотреть нюансы, адаптация там... еще что-то
вообще - все элементарно.

Answer 1

[Ярослав Зозуля]

картинка вроде и так по центру экрана.

а меню можно выбить из потока абсолютом и дать прозрачность фону.
position: absolute
top: 0
left: 0