HTML ネスト規則_html/css_WEB-ITnose

参考:

address、blockquote 、center、dir、div、dl、dt、dd、fieldset、form、h1~h6、hr、isindex、menu、noframes、noscript、ol、p、pre 、table、ul など。

インライン要素:

a、abbr、頭字語、b、bdo、big、br、cite、code、dfn、em、font、i、img、input、kbd、label、 q、s、samp、select、small、span、strike、strong、sub、sup、textarea、tt、u、var など

ネストルール:

ブロックにはブロックとインラインを含めることができ、インラインにはのみ含めることができますinline を含む

ブロック要素にはインライン要素または特定のブロック要素を含めることができますが、インライン要素にはブロック要素を含めることはできません。含めることができるのは他のインライン要素のみです

タイトルと段落にはブロックを含めることはできません

特殊なブロックレベルの要素がいくつかあります。インライン要素のみを含めることができます。ブロック レベルの要素は含めることはできません。これらの特別なタグは

h1、h2、h3、h4、h5、h6、p、dt

ブロックとインラインを並置することはできません

ブロック レベルの要素は並置されます埋め込み要素はインライン要素と並置されます

注:

li はブロックレベルの要素であり、ブロックレベルの要素 (ul を含む) をネストできます。

一部のタグには、ul に li が含まれる、ol に li が含まれる、dl に dt と dd が含まれるなど、固定のネスト ルールがあります。

は、w3School チュートリアルのこのタグの例を参照してください。 <strong> </strong> ここで説明しますが、display を使用してブロックとインラインを設定することはできますが、ネスト関係を定義するのは明らかに厳密ではありません。 （検索エンジンはCSSコンテンツをクロールするのだろうか？ほとんどのブラウザでは解析エラーが発生します

要素などに

を埋め込むと、すべてのブラウザで解析エラーが発生します

内に

を埋め込むと、解析エラーが発生します

要素はすべてのブラウザで正常に解析できます

要素を埋め込むと、すべてのブラウザで解析エラーが発生します (ボタンや入力などのインタラクティブな要素をネストすることはできません)

などのリスト要素にリストの兄弟要素を追加すると、IE6IE7 で解析エラーが発生します

実際、ここで解析エラーと言うのは、 によって解析された結果を意味するはずです。ブラウザーは私たちが期待する結果と一致しませんが、

ネストされたエラーはページのレンダリングに重大なエラーを引き起こすことはありません。

最後に:

タグをネストできますが、ブラウザのレンダリング効率を向上させるために、ネストするタグの数をできるだけ少なくし、それらをフラット化する必要があります。

と

> div >/ a > ; h4 > li >

ul >

上記のコードは Facebook からのもので、すぐに素晴らしいと感じました。ははは。