html - 如何使用 CSS 将 "crop"矩形图像变成正方形？

Question

我知道实际上用 CSS 修改图像是不可能的，这就是我将 crop 放在引号中的原因。

我想做的是拍摄矩形图像并使用 CSS 使它们看起来是方形的，而根本不会扭曲图像。

我基本上想把这个:

进入这个:

Answer 1

没有包装 div 或其他无用代码的纯 CSS 解决方案:

img {
  object-fit: cover;
  width: 230px;
  height: 230px;
}