日文文書処理

ウェブページの作成

HTML文書の基本構造

HTML文書の基本構造は次のようになる。

※HTML文書の基本構造
   <html>
     <head>
       head要素の内容(HTML文書に関する情報が書かれる)
     </head>
     <body>
       body要素の内容(本文として表示される情報が書かれる)
     </body>
   </html>

HTML文書HTML documentは、1つの〈html要素〉html elementによって構成される。

〈html要素〉は、1つの〈head要素〉head elementと1つの〈body要素〉body elementによって構成される。

〈html要素〉、〈head要素〉、〈body要素〉は、同じHTML文書中で繰り返して使うことはできない(1回だけしか使えない)。

一般に、〈head要素〉の内容は、HTML文書のタイトルなどのHTML文書そのものに関する様々な情報を含む。〈body要素〉の内容は、ユーザエージェントを介してユーザに本文として表示される様々な情報を含む。

また、〈head要素〉と〈body要素〉は、必ず『〈head要素〉→〈body要素〉』の順番で記述する。

親要素と子要素

ある要素と別の要素とは、一方が上位で他方が下位という上下関係を作る。この上下関係を「入れ子(ネスト)nest」という。このとき、上位の要素を「親要素parent element / containing element」、下位の要素を「子要素child element」という。

   <html>
     <head>
       〜〜〜〜〜 HTML文書に関する情報が書かれる 〜〜〜〜〜
     </head>
     <body>
       〜〜〜〜〜 本文として表示される情報が書かれる 〜〜〜〜
     </body>
   </html>
[html要素[head要素][body要素]]

サンプルの「入れ子」は図で示したようになっている。ここでは、〈html要素〉が〈head要素〉と〈body要素〉の親要素であり、〈head要素〉と〈body〉要素は〈html要素〉の子要素である。

どの要素がどの要素の親要素になるか、どの要素がどの要素の子要素になるかについては、HTMLHyperText Markup Languageで定められている。例えば、〈body要素〉と〈head要素〉は必ず〈html要素〉の子要素にならなければならない。逆に、〈html要素〉は、〈head要素〉と〈body要素〉の親要素になるが、子要素にはならない。また、〈body要素〉は〈head要素〉の子要素にはならず、〈head要素〉は〈body要素〉の子要素にはならない。

※誤った記述の例:〈body要素〉が〈head要素〉の子要素になっている
   <html>
     <head>
       〜〜〜〜〜〜〜〜〜〜
        <body>
       〜〜〜〜〜〜〜〜〜
        </body>
     </head>
   </html>
※誤った記述の例:〈body要素〉が〈html要素〉の子要素になっていない <html> <head> 〜〜〜〜〜〜〜〜〜〜 </head> </html> <body> 〜〜〜〜〜〜〜〜〜 </body>

したがって、〈html要素〉と〈head要素〉と〈body要素〉の関係は、必ず次のようになる。

※HTML文書の基本構造(正しい「入れ子」)
   <html>
     <head>
       head要素の内容(HTML文書に関する情報が書かれる)
     </head>
     <body>
       body要素の内容(本文として表示される情報が書かれる)
     </body>
   </html>
ページの先頭へ↑
←ひとつ前に戻る
目次へ
トップページへ