コードで指定していないのに、画像の下に目に見えない余白があるのはなぜですか?

写真の下にある奇妙な目に見えないマージン

この号では、著者は、Web ページの画像の下に、何も表示されていないにもかかわらず、目に見えないマージンに遭遇しました。コードにそのような余裕があります。これは、インライン要素としての画像の性質によって引き起こされる一般的な問題です。

応答によると、画像のデフォルトのインライン動作により、テキストのベースラインと一致する画像の下部とテキストの下部の間にスペースが作成されます。テキスト行。これを解決するには、画像をブロック要素に変換することです。

簡単な解決策の 1 つは、display: block; を使用することです。これを達成するために。もう 1 つの方法は、float: left; を使用して画像を浮動させることです。

vertical-align、font-size、line-height などのプロパティの調整も間隔に影響を与える可能性がありますが、信頼性は低く、依然として影響を受けやすいです。

詳細については、次の関連質問を参照してください。

• XHTML 1.0 で画像の下に不要なスペースが入っている
• 画像が余分に表示されるのはなぜですか間隔?
• IE 画像の間隔の問題

以上がコードで指定していないのに、画像の下に目に見えない余白があるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。