XHTMLタグのネストルール解析_HTML/Xhtml_Webページ制作

XHTML の言語では、ul タグには li が含まれ、dl タグには dt と dd が含まれていることは誰もが知っています。これらの固定タグのネスト ルールは非常に明確です。ただし、h1、div、p など、独立していて一緒にバンドルされていないタグがまだ多数あります。では、これらのタグのネスト ルールは何でしょうか?今日はこの話題について話しましょう。

XHTML タグの入れ子ルールに関しては、XHTML タグには 2 つのタイプがあることをまず知っておく必要があります。1 つは ブロックレベル要素(ブロック) と呼ばれ、もう 1 つは インライン要素 (インライン、多くの人はインライン、インライン、ラインレベルなどとも呼びます)。

ブロックレベル要素とインライン要素 の 分類基準は非常に簡単です。次の 2 行のコードを body タグに挿入してください。

div1

div2

ブラウザのレンダリング効果:

div1

div2

ページに表示される 2 つの div は、フローティングされているか他の設定が行われていない限り、2 行のスペースを占有します。これらはすべて、横並びで独自の行を占有します。 - - タグが表示されるたびに。この現象を示す場合は、次のように呼ぶことができます。 ブロックレベル要素 (ブロック) ;

次の 2 行のコードを body タグに挿入します。

span1

span2

ブラウザのレンダリング効果:

スパン1 スパン2

今回は、2 つのスパンが 1 行に並置されており、友好的で調和しています。

インライン要素 (inline) ; のようにタグ動作と呼ぶことができます。

ブロックレベル要素とインライン要素の違い:

・ブロックレベル要素 は通常、Web サイトのアーキテクチャ、レイアウト、およびコンテンツの実行に使用されます。これらの主要な物理的タスクはすべて、次のタグを含むブロックレベル要素に属します。 > div、ul、li、dl、dt、dd、h1~h6、p、

アドレス

……

・インライン要素

は通常、「スタイル、上付き文字、下付き文字、アンカーを強調、区別する」などの目的で、Web サイトのコンテンツの特定の詳細または部分で使用されます。以下のタグはすべてインライン要素です: a、span、strong、

sub

、sup、img...

・ブロック要素とインライン要素

は相互に 変換できます。 変換コードは次のとおりです。 display: block; /* ブロック要素に変換します */

display: inline; /* インライン要素に変換します */

・ブロック要素とインライン要素

では、CSS の

に対する呼び出しルール が異なります (この記事ではタグのネストについて説明するため、この知識ポイントについては説明しません)。

ブロック要素とインライン要素を簡単に理解した後、

XHTML タグ

のネスト ルールを以下にリストします。

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

:

—— はい —— True

—— False

2. ブロックレベルの要素は

内に配置できません:

—— 間違っています

—— 違います

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

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

4. li には div タグを含めることができます

- この項目を個別にリストする必要はありませんが、インターネット上の多くの人がこれについて混乱しているため、ここで簡単に説明します。

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

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

—— はい

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。