マージンとパディングがゼロであるにもかかわらず、画像と Div 境界線の間にギャップがあるのはなぜですか?

アンカー要素の移動

コードには、境界線のある div 内に囲まれた画像を囲むアンカー タグがあります。マージンとパディングの両方を 0 に設定しているにもかかわらず、画像と div の境界線の間に約 3 ピクセルのギャップが継続的に発生します。

根本原因: インライン表示

この不一致の根本原因は、イメージ要素のインライン表示にあります。インラインで表示すると、画像はテキスト内の文字と同様に動作します。その結果、これらはベースライン上に配置され、「j」、「g」、「y」、「p」などの文字に見られるディセンダを収容できます。

解像度: 垂直方向の調整配置

この不要なスペースを削除するには、CSS を使用して画像の垂直方向の配置を調整します。スタイル ルール「img {vertical-align:bottom}」を適用すると、画像が行の一番下に位置合わせされるように指示され、画像と div の境界線の間のギャップがなくなります。

以上がマージンとパディングがゼロであるにもかかわらず、画像と Div 境界線の間にギャップがあるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。