御隠居のホームページ基礎
12. ブロックとインライン
これまでいくつかの要素を見て来たが、Webページとしてブラウザ上に表示される部分は、 body要素の内容として記述した。ここに色々な要素を指定するが、 これまでのものは大きく分けて２種類に分類される。
- ブロックレベル要素
- ブロックレベル要素は、矩形（四角）として表現される文章を意味する要素群である。 これまでの要素では、見出し要素、段落要素が、このブロックレベル要素に分類される。 通常、ブロックレベル要素の前後は自動的に改行される。
- インライン要素
- インライン要素は、文章内の一部分の構造を表現する要素である。 これまでの要素では、改行要素、字句要素が、このインライン要素に分類される。
この要素群の分類は、とても重要である。インライン要素をブロックレベル要素の中に記述することは可能である。 しかし、その逆はできない。
<p><strong>正しい記述</strong></p>
<strong><p>誤った記述</p></strong>このサンプルの場合、１行目は正しいが、２行目は誤った記述となっている。 しかし、ブラウザは、どちらも問題なく表示してしまう。多くのブラウザは、このような誤りをチェックすることができない。 ブラウザは、ページ閲覧のために表示することが目的のソフトウェアであり、文法チェックをすることが目的ではないからだ。 この点は、十分に注意して欲しい。詳しくは、「XHTMLの文法チェックをしよう」を参照して欲しい。
さて、前にも簡単な部分は説明したが、XHTML（HTML）の文法は、DTDによって規定されている。 言い換えれば、DTDを読むことがXHTML（HTML）の文法を理解することになる。
さて、DTDを読む前に、もう少し、例を見てみよう。まず、ブロックレベル要素同士の場合、その内容にブロックレベルを持つことはできない。 つまり、段落要素の中に見出し要素を記述したり、その逆はできない。
<p>段落１−１<h1>見出し</h1>段落１−２</p> 誤った記述一部の例外はあるが、インライン要素の中にインライン要素を記述することはできる。
<code><strong>字句</strong></code> 正しい記述
<strong><code>字句</code></strong> 正しい記述さて、次はいよいよDTDの読み方について見てみよう。