Как реализовать подобное наложение?

Question

[deniskins23]

Всем привет. Кто может подсказать как реализовать подобное наложение изображений? Ломал голову но так и не придумал. Основная суть вопроса в том, что изображения обычной формы - прямоугольные и нужно реализовать их шестигранную форму и при этом наложить друг на друга так.

Comments

[Павел Антонов]

абсолютное позиционирование + z-index

[deniskins23]

Павел Антонов, суть в том, что изображения не обрезаны, а обычной прямоугольной формы!меня интересует именно как реализовать их отображение в шестигранной форме.

Answer 1

[Андрей Гончаров]

Посмотри как сделано тут:

Comments

[deniskins23]

А если их наложить друг на друга, то они будут прозрачны?

[Андрей Гончаров]

deniskins23, Да через clip-path будут прозрачные. Я слишком большой пример скинул - весь смысл в одной строчке:

сlip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);

[deniskins23]

Андрей Гончаров, Понял. Спасибо за ответ. +1 к ауре.-)

Answer 2

[Владимир Проскурин]

Как обычно - svg маски