ホームページ >ウェブフロントエンド >CSSチュートリアル >Div 内で画像を水平方向の中央に配置するにはどうすればよいですか?

Div 内で画像を水平方向の中央に配置するにはどうすればよいですか?

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-12-26 04:46:11851ブラウズ

How Do I Horizontally Center an Image Inside a Div?

Div 要素内で画像を水平方向の中央に配置する方法

コンテナ div 内で画像を水平方向の中央に配置するのが困難です。提供された解決策を試しても、問題は解決しません。

これを解決するには、次の CSS を検討してください:

#artiststhumbnail a img {
    display:block;
    margin:auto;
}

この解決策は次の手法を採用しています:

  1. ブロック表示: 画像の表示を「ブロック」に設定すると、画像が独自の行を占有し、画像として扱われるようになります。中央揃えを容易にするブロック要素。
  2. 自動左右マージン: 「margin:auto;」プロパティは自動的に等しい左右のマージンを計算し、水平方向のセンタリングを保証します。

このアプローチは、次のフィドルで実証され、効果的であることが証明されています: http://jsfiddle.net/marvo/3k3CC/2/

以上がDiv 内で画像を水平方向の中央に配置するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。