アンカー タグがコンテナの高さを無視し、幅を尊重するのはなぜですか?

アンカー タグがコンテナの高さと幅を無視する理由

HTML では、アンカー タグ () は設定された高さと幅のプロパティを無視することが多いようですそれらを含む要素について。これは、提供されている JsFiddle に示されているように、開発者ツールを使用してそのような要素のサイズを検査することで確認できます。

高さの計算

CSS 2.1 仕様では、アンカー タグのコンテンツ領域の高さを規定しています。フォントのメトリクスによってのみ決定されます。アンカー タグはデフォルトでインライン表示になるため、基本的にアンカー タグ自体がコンテンツの周りを包み込みます。したがって、高さプロパティはアンカー タグのようなインライン要素には適用されません。

この例では、周囲の要素の高さの指定に関係なく、アンカー タグ内の 1 行のテキストによって 18 ピクセルの高さが決まります。

幅の計算

アンカー タグはコンテナの高さプロパティには準拠しませんが、幅の計算には関与します。ただし、幅は、パディング、ボーダー、マージンを含む要素自体のコンテンツによって決まります。

最初のアンカー タグの場合、幅は次のように計算されます。

• コンテンツの幅(画像空間): 114px
• 左マージン: 20px
• 左右borders: 2x5px
• 合計幅: 144px

同様に、2 番目のアンカー タグの幅は次のように決定されます。

• コンテンツ幅 (画像): 280px
• 左マージン: 20px
• 左右の境界線: 2x5px
• 合計幅: 310px

さらに、アンカー タグのコンテンツ内のスペースは幅の計算に影響します。最初のタグの先頭と 2 番目のタグの末尾のスペースはインライン形式により省略され、それらの間のスペースは 1 つにまとめられます。この 1 つのスペースは最初のタグの幅に影響しますが、2 番目のタグには影響しません。

以上がアンカー タグがコンテナの高さを無視し、幅を尊重するのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。