はじめに
一般に、ブロック要素をインライン要素内に配置するのは間違っていると理解されています。しかし、逆の場合はどうなるでしょうか?具体的には、段落を含む div が CSS によってインラインに変換された場合でも、HTML 検証ルールに準拠しますか?
CSS 仕様
CSS 2.1 仕様によるの場合、ブロック レベル ボックスを含むインライン ボックスは、ブロック レベル ボックスの前後に 1 つずつ、計 2 つの匿名ブロック ボックスに分割されます。これらのボックスは、ブロックレベルのボックスの兄弟になります。この動作は、いずれかの匿名ブロック ボックスが空の場合にも適用されます。
HTML 検証
HTML 検証ステータスは、CSS 適用の前に評価されるか後に評価されるかによって異なります。 CSS が適用される前の HTML は有効です。ただし、CSS 変換後、ドキュメントは HTML 仕様に従って無効になる可能性があります。
実装とブラウザのサポート
CSS 仕様は、ブラウザがどのように機能するかについてのガイドラインを提供します。このシナリオを処理します。ただし、ブラウザの実装は異なる場合があります。一部のブラウザでは、ネストされたブロックの周囲に「匿名行ボックス」を作成することで、ブロックを含むインライン要素に境界線を実装しています。この動作は CSS1 または CSS2 で明示的に定義されていないため、すべてのブラウザで一貫しているとは限りません。
HTML5 の考慮事項
HTML5 では、ブロックレベルで配置することが許可されています。インライン要素内の要素 (リンクなど)。これは、クリック可能な HTML コンテンツの大きなブロックを作成するときに役立ちます。
結論
CSS 変換後のインライン要素内に含まれるブロック要素の動作は CSS で指定されます。仕様に応じて、このルールの解釈と実装はブラウザによって異なる場合があります。 HTML 検証への影響は、CSS 適用の前か後、いつ検証が実行されるかによって異なります。
以上が他のブロック要素が含まれている場合、ブロック要素を CSS 経由でインラインに変換することは有効な HTML ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。