Пример реализован на css-свойствах grid и clip-path

Пример:

Решение сделано для квадратных изображений. Если они друого формата - нужно корректировать css-свойство margin-bottom (см. ниже)

HTML:

CSS:

Если при наведении мышки нужно показать фотографию как она есть (пример на фото к теме), нужно заменить:

на:

Фотографии kellepics

Смотрите также:

Оформление блок-секции для лицензий, сертификатов или других вертикальных фотографий на CSS

Небольшой скрипт для полноэкранного просмотра одиночных изображений

Пример создания модальной картины из изображения на CSS

Добавить комментарий:

Ваш комментарий отправлен!