HTML要素

HTML 要素

HTML 要素とは?

HTML要素とは、開始タグから終了タグまでのすべてのコードを指します。

例:

<p>段落コンテンツ</p>

<p> は終了タグ、「段落コンテンツ」は要素コンテンツです

< ;a> リンクコンテンツ </a>

<a> は開始タグ、</a> は要素コンテンツです

HTML要素は開始タグで始まります開始

HTML要素は終了タグで終了します

要素のコンテンツは開始タグと終了タグの間のコンテンツです

一部のHTML要素には空のコンテンツ（空のコンテンツ）があります)

空の要素は開始タグ (タグで始まる) で閉じられます

ほとんどの HTML 要素は属性を持つことができます

注: 属性については、このチュートリアルの次の章で詳しく学習します。

ネストされた HTML 要素

<pほとんどの html="" 要素はネストできます (他の ="" 要素を含めることができます)。

ネスティングとは何ですか?ネストのルールとは何ですか?

ネストとは、ブロックレベルの要素 (block) にインライン要素 (inline) が、完成するまでレイヤーごとに含まれることを意味します。

HTML ドキュメントは、ネストされた HTML 要素で構成されます。

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

ブロックレベル要素

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

コードは次のとおりです:

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, 大きい, br, 引用, コード, dfn, em, フォント, 私, 画像, 入力, kbd, ラベル, q, s, サンプ, 選択, 小さい, スパン, ストライク, 強い, サブ, sup, テキストエリア、tt、u、var

HTMLタグのネストルール

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

は次のとおりです

<div><h1></h1><p></p></div><a href=”#” ><span></span></a> —— 正しい</p></span> —— 間違っています

;p>: コードは次のとおりです:<p><ol></li></ol></p> —— 間違っています</p>ブロックレベルの要素にはインライン要素のみを含めることができ、ブロックレベルの要素は含めることはできません。これらの特別なタグは

コードは次のとおりです:

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

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

li タグと div タグは両方ともコンテンツをロードするためのコンテナです。ステータスが同等で階層がない場合 (例: h1 や h2^_^ などの厳密な階層)、li タグは親の ul または ol にも対応できることを知っておく必要があります。なぜ一部の人々は li が div に対応できないと考えているのでしょうか。 ? li がとてもケチだとは思わないでください。実際、li は大きな心を持っています...

ブロックレベルの要素と並列されています。 inline要素はinline要素と並置されます

コードは次のとおりです

<スパン>

; —— 間違っています

HTML ドキュメントの例

<!DOCTYPE html>
 <html>
 
 <body>
 <p>这里是测试事例</p>
 </body>
 
 </html>

上の例には 3 つの HTML 要素が含まれています。

HTML の分析例

<p> 要素:

<p>これがテストケースです</p>

この <p> 要素は HTML ドキュメント内の段落を定義します。
この要素には開始タグ <p> と終了タグ </p> があります。
要素の内容は次のとおりです。

要素:

<body>
< p> これがテストケースです</p>
</body>

<body> 要素は HTML ドキュメントの本文を定義します。
この要素には開始タグ <body> と終了タグ </body> があります。
要素のコンテンツは、別の HTML 要素 (p 要素) です。

<html> 要素:

<html>

<body>
<p>これがテストケースです</p>
</body>

</html>

<html> 要素は HTML ドキュメント全体を定義します。
この要素には開始タグ <html> と終了タグ </html> があります。
要素の内容は別の HTML 要素 (body 要素) です。

終了タグを忘れないでください

終了タグの使用を忘れたとしても、ほとんどのブラウザは HTML を正しく表示します:

<p>これは段落です
<p>これは段落

タグを閉じることはオプションであるため、上記の例はブラウザーで通常どおり表示することもできます。

ただし、このアプローチに依存しないでください。終了タグの使用を忘れると、予期しない結果やエラーが発生する可能性があります。

HTMLの空要素

コンテンツのないHTML要素は空要素と呼ばれます。空の要素は開始タグで閉じられます。

<br> は終了タグのない空の要素です (<br> タグ定義はラップされます)。

XHTML、XML、および HTML の将来のバージョンでは、すべての要素を閉じる必要があります。

<br /> などの開始タグにスラッシュを追加することは、空の要素を閉じる正しい方法であり、HTML、XHTML、および XML で受け入れられます。

<br> はすべてのブラウザで有効ですが、実際には <br /> を使用すると長期保証になります。

HTML ヒント: 小文字のタグを使用してください

HTML タグは大文字と小文字を区別しません。<P> は <p> と同等です。多くの Web サイトでは大文字の HTML タグが使用されています。

W3CSschool は小文字のタグを使用します。これは、World Wide Web Consortium (W3C) が HTML 4 で小文字を推奨しており、将来の (X)HTML バージョンでは小文字を必須にする予定であるためです。

学び続ける

新しいファイル

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <h1>欢迎学习HTML</h1> <h2>欢迎学习HTML</h2> <h3>欢迎学习HTML</h3> <p>这里是第一段内容</p> <p>这是第二段内容</p> <a href="http://php.cn/">点击学习</a> <br/> <img src="https://img.php.cn/upload/course/000/000/007/57fb2bca70c24537.jpg"> </body> </html> 同学们从上面的例子中找出各个标签的元素内容。

提出するリセットコード

自動運転