До CSS3 обрезать изображения было очень непросто, если помните. Но теперь у нас есть два отличных свойства: object-fit
и object-position
. С их помощью можно изменять размеры изображения, не влияя на соотношение его сторон.
Конечно, всегда можно обрезать изображение в редакторе, но благодаря CSS инструментам мы можем все это дело анимировать.
В примере вы можете запустить этот эффект с помощью чекбокса: он привязан к псевдоклассу :checked
.