css - 画像をdivに調整し、中央に配置します

Question

さて、私は寸法幅：200pxと高さ：110pxのdivホルダーを持っています。

画像を読み込むと、通常はそのようなサイズを超えます。そのため、画像のサイズに応じて、幅または高さで画像をそのようなコンテンツに調整する必要があります。したがって、withで調整すると、次の3つの状況が発生する可能性があります。

1.-高さが110pxより大きいため、divオーバーフローが非表示に設定されているため、垂直方向の中央に配置する必要があります。

2.-高さは110pxに等しい、問題ありません。

3 .-（問題）高さが110px未満です。この状況で私は何をすべきでしょうか？すべてのdivコンテンツをカバーしたいからです。

ありがとう。

Answer 1

コンテナの背景として画像を読み込む場合は、background-size: coverまたはをいじって、サイズに関係なく画像を中央に保持するためにbackground-size: contain使用できます。background-position: center center

または、テーブルセルを使用することもできます。これにより、コンテンツを内部で垂直方向に整列させることができます（1つのセルを持つテーブルを使用するかdisplay: table-cell、コンテナー上で使用します）。