Как правильно сверстать эти части макета?

Question

[maaestr0]

Здравствуйте, у меня возникло сразу два вопроса по верстке.
Как правильно сверстать эти части?

Там фоном есть фото, сверху покрыто полупрозрачным слоем, но части полностью без этой пленки.
И второй вопрос
На сайте присутствует много таких вставок с разными фото

Если я просто сделаю их абсолютными и размещу куда нужно, это будет лучший вариант?
Буду благодарен за любой совет.

Comments

[Semantic.Moscow]

а "там", это где?
может заглянуть в код и повторить?

[maaestr0]

Semantic.Moscow,
"там" я имел в виду в шаблоне в фигме.

[Semantic.Moscow]

вот шаблон фигмы и расковыряйте

[Антон Литвиненко]

картинка справа это еще и слайдер)

[maaestr0]

Антон Литвиненко, Думаю с этим проблем не будет

[Сергей delphinpro]

Антон Литвиненко, а может это и один слайдер с двумя "дырками".

[maaestr0]

Сергей delphinpro, да, но каким способом сделать эти дырки?

[Максим]

maaestr0, svg, возьмите его из фигмы

[Антон Литвиненко]

Сергей delphinpro, стопудов. сверху маска с дырками, под ней слайдер

[maaestr0]

Антон Литвиненко, Есть варианты как сделать эти дырки?

[Сергей delphinpro]

maaestr0, наложить сверху png маску. использовать svg маски. использовать clip-path

[cssfish]

слайдер огонь...