Ты можешь использовать два div
один для контента и другого для изображения. Ты распределяешь обоим свойство position: absolute;
, но с различными z-index
... Налаживает их tamaГ±os в твою необходимость .
Выполняет snnipet
для того, чтобы ты увидел результат. изображение может направлять немного, чтобы появляться, из-за того, что его быть одним vГ-nculo приходящий ученик.
.base{
position: absolute;
z-index: 0;
width: 300px;
height: 100px;
background: #000;
clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}
.overlap{
position: absolute;
z-index: 10;
left : 100px;
}
<div class="base">
</div>
<div class="overlap">
<img src="https://picsum.photos/100/200" alt="">
</div>