Как сделать контейнер для изображения css?

Question

[WebforSelf]

Есть в макете вот слайдер


Требуется чтоб любое изображение туда подгружалось , а фон вокруг накладывался бы.
Пытался сделать внутренний бордер. Не могу понять как сделать пятиугольником изображение. и на задний фон вынести те углы .

Думаю если проблему с задним фоном можно решить через псевдоэлемент, то как сделать фото пятигранным и с внутренним бордером.

Answer 1

[profesor08]

clip-path
делай несколько элементов, обрезай как надо, задавай им нужный фон.

Answer 2

[CyberCoder]

Если фото меняются скриптом, то можно в SVG нарисовать рамку и маску, а картинку подставлять js'ом