画像を含むアンカー タグの下に原因不明の空白があるのはなぜですか?

アンカー タグの下の謎の空白

非常に特殊なレイアウトの難問において、画像を囲むアンカー タグには説明できない高さの差異があり、根元に見苦しい隙間がある。マージンとパディングの両方をゼロに設定しているにもかかわらず、タグは意図した境界よりも高いままであり、望ましい美観が損なわれています。

困惑したプログラマーは明確さを求めています

この不可解な問題への答えを求めています謎に満ちており、プログラマーは FireFox と Chrome の両方を調べましたが、同じ困惑する結果に遭遇するだけでした。この不要なスペースの原因は依然としてとらえどころがなく、開発者は頭を悩ませています。

降下を明らかにする

詳しく調べると、画像がインラインでレンダリングされていることが明らかになります。テキスト文字と同様に動作します。この配置により、画像がベースライン上に配置され、ディセンダ スペースと呼ばれる分離が作成されます。ディセンダーは、「j」、「g」、「y」、「p」などの小文字の細長い部分です。

垂直性が復元されました

この問題を修正するには、CSSの調整が必要です。画像に「vertical-align:bottom」を適用すると、画像の垂直方向の配置が含まれる要素の下部に移動します。この変更によりディセンダースペースが削除され、画像がその下の境界と同一面に整列し、不可解な空白スペースの謎が解決されます。

以上が画像を含むアンカー タグの下に原因不明の空白があるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。