ホームページ  >  記事  >  ウェブフロントエンド  >  超簡単だけど意外と知らない HTML tags_html/css_WEB-ITnose の入れ子のルール

超簡単だけど意外と知らない HTML tags_html/css_WEB-ITnose の入れ子のルール

WBOY
WBOYオリジナル
2016-06-24 11:47:09911ブラウズ

多くの XHTML タグがあります: 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、textarea、tt、u、var

2. HTMLタグの入れ子のルール

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

はい

< ;a href=”#”>< ;span> ?? 正しい

2. ブロックレベルの要素は配置できません

内:

?? 間違っています

;

< /div>

?? 間違っています

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

h1、h2、h3 です。 、h4、h5、h6、p、dt

4. li に div タグを含めることはできますか?? この項目は個別にリストする必要はありませんが、インターネット上の多くの人が混乱していますので、ここで簡単に説明します:

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

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

?? はい

そうですね

;

違います