HTML 画像要素で CSS `background-size: cover` の動作を実現するにはどうすればよいですか?

HTML 要素で画像をカバーおよび包含する

CSS の背景サイズ: cover および contains プロパティは、背景の画像の柔軟なスケーリングを提供します。ただし、HTML 要素を使用して表示される画像を同様に制御したい場合はどうすればよいでしょうか?その方法は次のとおりです。

解決策 1: object-fit プロパティ

object-fit プロパティを使用すると、画像がコンテナ内にどのように収まるかを指定できます。 cover に設定すると、background-size: cover の動作が複製され、アスペクト比を維持しながらコンテナ全体を満たすように画像を拡大縮小します。

img {
  object-fit: cover;
}

注: IE はオブジェクトをサポートしません。 -フィットします。

以上がHTML 画像要素で CSS `background-size: cover` の動作を実現するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。