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

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

Mary-Kate Olsen
リリース: 2024-12-26 04:46:11
オリジナル
855 人が閲覧しました

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 サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート