アンカー内にdivを入れるのは正しいですか? 質問する

アンカー内にdivを入れるのは正しいですか? 質問する

インライン要素内にブロック要素を配置するのは HTML の罪だと聞いたことがあります。

<a href="http://example.com">
    <div>
        What we have here is a problem. 
        You see, an anchor element is an inline element,
        and the div element is a block level element.
    </div>
</a>

しかし、外側のアンカーをdisplay:blockスタイルシートのようにスタイル設定するとどうなるでしょうか?それでもまだ間違っているのでしょうか?HTML 4.01仕様では、ブロックレベル要素とインライン要素そう思うようだ:

スタイル シートは、要素をブロックとしてレンダリングするかインラインとしてレンダリングするかなど、任意の要素のレンダリングを指定する手段を提供します。リスト要素のインライン スタイルなど、場合によってはこれが適切なこともありますが、一般的に、作成者はこの方法で HTML 要素の従来の解釈を上書きすることは推奨されません。

この問題についてさらにヒントを持っている人はいますか?

ベストアンサー1

対応する HTML のバージョンに応じて、次のようになります。

  • HTML5 について要素は、<a>「その中にインタラクティブなコンテンツ(ボタンやその他のリンクなど)がない限り、段落、リスト、表など全体、さらにはセクション全体を囲むことができる」と規定されています。

  • HTML4.01 について<a>要素には以下のみを含めることができることを指定しますインライン要素. A<div>ブロック要素なので、 内には表示されない可能性があります<a>

    もちろん、インライン要素をブロックのようにスタイル設定したり、ブロックをインラインでレンダリングするようにスタイル設定したりすることは自由です。HTMLでの用語の使用は、inline要素blockとドキュメントのセマンティック構造との関係を指しますが、CSS での同じ用語は、要素の視覚的なスタイル設定に関係しています。インライン要素をブロック状に表示しても問題ありません。

    ただし、スクリーン リーダーなどの支援技術を介してアクセスする場合や、強力な Googlebot によって検査される場合など、CSS が存在しない場合でも、ドキュメントの構造が意味をなすことを確認する必要があります。

おすすめ記事