まずは,基本的な文書を記述することから始めてみよう。
p
要素 Section 2 でも登場したが,パラグラフを表すのが p
要素である。パラグラフは,それぞれ,<p>
および </p>
でマークアップされる。
<p>
...</p>
次に示すのは,2 つの p
要素である。
<p> “心に余裕を持つこと”は,いかなる場合でも大切なのではないか。</p>
<p> 心に余裕があるときは,自分をあるいは冷静に,客観的に見つめることができるだろう。往々にして,気張りすぎは最良の結果を生まないものだ。</p>
ご覧になってわかるように,p
要素はその内容にテキストを含めることができる。しかし,パラグラフおよび見出しのような,“文書中の大きなかたまり”を表す要素を含んではならない。たとえば,p
要素の内容に p
要素が含まれるとき,それは誤りである。
ところで,XHTML において,出力すべき本文は body
要素に書くと述べた。ここで,XHTML では,body
要素の内容にテキストを含んではならないことになっている。つまり,以下のように書かれた body
要素は誤りである。
<body>
“心に余裕を持つこと”は,いかなる場合でも大切なのではないか。
</body>
本文にテキストを記述するときは,その各部分がパラグラフであるか,見出しであるか,箇条書きの項目であるか,……,に応じてマークアップして要素とし,body
要素に含める形にしなければならない。先ほどの誤った例では,たとえばパラグラフとしてマークアップし,p
要素として body
要素に含めればよい。
<body>
<p> “心に余裕を持つこと”は,いかなる場合でも大切なのではないか。</p>
</body>
h1
〜h6
要素 見出しも,Section 2 で大見出しの要素 h1
が登場したが,詳しく説明し直そう。
XHTML では,見出しには 6 段階ある。h1
,h2
,h3
,h4
,h5
,h6
要素があり,数字の小さいほうがレベルの高い見出しになる。
<h1>
...</h1>
<h2>
...</h2>
<h3>
...</h3>
<h4>
...</h4>
<h5>
...</h5>
<h6>
...</h6>
この,“見出しのレベル”は,h1
要素が“章の見出し”であるとするならば,h2
要素は“節の見出し”,h3
要素は“項の見出し”,……,という関係で捉えていただければよい。言い換えると,文書の,“1.”,“2.”,“3.”,……,の見出しを h1
要素とすれば,“1.1.”,“1.2.”,……,“2.1.”,“2.2.”,……,の見出しは h2
要素,……,のようになる。
次に示すのは,もっともレベルの高い見出し h1
の例である。
<h1>心に余裕を</h1>
見出しの要素は,内容としてテキストを含むことができる。ただし,パラグラフ同様,“文書中の大きなかたまり”を表す要素を含んではならない。たとえば,見出しが入れ子になってはならないし,見出しの中にパラグラフが含まれるのも誤りである。
ここで,パラグラフと見出しを含むような,完全な形の XHTML を示しておこう。
<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Relax!</title>
</head>
<body>
<h1>心に余裕を</h1>
<p> “心に余裕を持つこと”は,いかなる場合でも大切なのではないか。</p>
<p> 心に余裕があるときは,自分をあるいは冷静に,客観的に見つめることができるだろう。往々にして,気張りすぎは最良の結果を生まないものだ。</p>
</body>
</html>
Section 4 で示した例も,完全な形の XHTML の例である。併せて参考にされたい。
以降,例では,XHTML の一部分を示すことにする。以降の例では,特に断らない限り,その示されたものを body
要素の内容とすれば,正しい XHTML になるようにしてある。