object-fit
参考：
使い方
表示領域を覆うように大きさを調節してトリミングする。
object-fit: cover;
表示領域に収まるように大きさを調節する。
object-fit: contain;
参考：
1行追加で OK！CSS だけで画像をトリミングできる object-fit プロパティー | Web クリエイターボックス
object-fit – CSS だけで画像をトリミングできる | FASTCODING BLOG
object-fit プロパティで画像をトリミングしよう | ウェブラボ関西オフィス
object-fit は CSS だけで画像をコンテナーにフィットさせてトリミングもできるとっても素晴らしいプロパティー | WEBDESIGNDAY
object-fit / object-position – 置換要素のレイアウトのためのプロパティ | CodeGrid
CSS で画像をトリミングする | HTML クイックリファレンス
CSS の object-fit による画像の切り抜き／リサイズまとめ | CatNose
object-fit プロパティの意味と使い方 | できるネット
object-fit Property | W3Schools
max-height AND max-width with CSS only – Stack Overflow
aspect-ratio
参考：
aspect-ratio プロパティの使い方／レスポンシブやレイアウトシフトで大活躍 | コリス
幅を制限する
img {
max-width: 100%;
height: auto;
}Code language: CSS (css)参考：
画像の横幅をウインドウ幅に合わせたいが、原寸より大きくはしたくない場合の CSS | にししふぁくとりー
画像の大きさを最適化する max-width: 100%; | ホームページの作り方
Responsive Web Design Images | W3Schools
max-width set to original image size? – Stack Overflow
Scaling Images Proportionally in CSS with max-width – Stack Overflow
How to set max width of an image in CSS – Stack Overflow
高さを制限する
参考：
Limit the height of a responsive image with CSS – Stack Overflow
Safari のバグ
height: 100%を指定すると表示がおかしくなる
参考：
Safari image resize bug? box-model issue? – Stack Overflow
Can I Use
参考：
object-fit | Can I Use Support Tables
object-position | Can I Use Support Tables
まとめ
参考：