HTMLタグのネストルール-htmlチュートリアル-php.cn

HTMLタグのネストルール

伊谢尔伦

リリース： 2016-11-23 09:37:35

オリジナル

1657 人が閲覧しました

HTML には多くのタグがあります: div、ul、li、dl、dt、dd、h1~h6、p、a、addressa、span、strong... これらのタグを使用してページ構造を構築すると、無限に使用できます。 . ただし、ネストには特定のルールも必要です。個人的な習慣をランダムにネストすることはできません。では、HTML タグのネストルールは何でしょうか。

1. HTML タグには、ブロックレベルの要素 (block) とインライン要素 (inline) が含まれます

1. ブロックレベルの要素

は、通常、Web サイトのアーキテクチャ、レイアウトを構築し、コンテンツを運ぶために使用されます...これには次のものが含まれますタグ:

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

2インライン要素

通常、「スタイル、上付き文字、下付き文字、アンカーポイントを強調、区別する」ためにウェブサイトコンテンツの特定の詳細や部分で使用されます。次のタグはすべて埋め込み要素です:

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、テキストエリア、tt、 u, var

II. HTMLタグのネストルール

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

<。 ;h1>

—— そうです

;p>内側:

--間違っています

;div> h4, h5, h6, p, dt

4. li には div タグを含めることができます - この項目は個別に記載する必要はありませんが、ネット上で混乱している人が多いため、ここで簡単に説明します:

li タグと div タグはどちらもコンテンツをロードするためのコンテナであり、レベル間の区別はありません (たとえば、h1 と h2^_^ などの厳密な階層)。親 ul または ol に対応できるのですが、なぜ li は div に対応できないと考えるのでしょうか。 li がとてもケチだと思わないでください。実際、li は大きな心を持っています...

5. ブロックレベルの要素とインライン要素が並列されます。

—— はい

;