HTML要素をネストする方法
このチュートリアルでは、単一のコンテンツに複数のHTMLタグを適用するためにHTML要素をネストする方法を説明します。
HTML要素はネストにすることができます。つまり、ある要素を別の要素の中に配置することができます。 ネストを使用すると、1つのコンテンツに複数のHTMLタグを適用できます。 たとえば、index.html
ファイル内に次のコードスニペットを貼り付けてみてください。
<strong>My bold text and <em>my bold and emphasized text</em></strong>
ファイルを保存して、ブラウザにリロードします。 (index.html
ファイルの作成手順については、チュートリアルを参照してください。または、ファイルをブラウザにロードする方法については、チュートリアルを参照してください。)何かを受け取る必要があります。このような:
私の太字のテキストと太字で強調されたテキスト
ネストのベストプラクティス
ネストされたタグは、開いたときとは逆の順序で常に閉じることをお勧めします。
たとえば、次の例では、<em>
タグは、最後のタグであったため、最初に閉じます。開いた。 <strong>
タグは、最初に開いたため、最後に閉じます。
This sentence contains HTML elements that are <strong><em>nested according to best practices</em></strong>.
反例として、次のHTMLコードには、<strong>
タグがbefore <em>
を閉じるため、ベストプラクティスに従ってネストされていないタグが含まれています。鬼ごっこ:
This sentence contains HTML elements that are <strong><em>not nested according to best practices</strong></em>.
ブラウザでHTMLをレンダリングするために技術的に必要ではありませんが、タグを適切な順序でネストすると、自分や他の開発者にとってHTMLコードの読みやすさが向上します。