Top > 早わかり操作法 > タグ基本思考法

タグ基本思考法

ブロック要素とインライン要素  

 HAIK(Quick Homepage Maker)で、ページを編集するときに、HAIKのタグ(専用の命令記述)を使いますよね。
 たとえば、上のようなもくじを表示させたいときには、

#contents

と書いたり、見出しを表示したいときには

*見出しだよ

と書いたりします。
 この「#contents」「*」を、ここでは、HAIKのタグ(専用の命令記述)と呼ぶことにします。北摂情報学研究所の亀田氏は、これのことをよく「おまじない」と表現しています。

 それで、ここで是非とも把握しておいていただきたいのは、これらのタグ(おまじない)には、2種類あるということです。
 この違いを理解していないと、「これでうまくいくはずなのに、うまくいかない!」「くそー!」ということになる可能性が高くなります。

 しかし、「区別」といっても、それほど難しいことはありません。
 つまり、これらのタグの中には、そのタグの前後で改行されてしまうもの、つまり「ブロック要素」と、そのタグの前後で改行されずに、他のブロック要素の中に入れ込んで使えるもの、すなわち「インライン要素」とがあるということです。

 たとえば、上の見出しやもくじですが、
それを右寄せにして、左に何かを置くというようなことはできません。
 また、

行の途中で、*見出し

のように書いても、意図したとおり見出しにはなりません。
 それは、これらのタグが、ブロック要素だから、タグが書かれた一行を、占有してしまうためです。
 ブロック要素の中には、下の説明にも書いたとおり、いくらかは他のブロック要素を子要素にすることができるものもあるようです。しかし、「段落、見出し、水平線、#から始まるブロック要素」は、他のブロック要素を子要素にすることができません
 つまり、我々が使うほとんどのブロック要素は、他のブロック要素を子どもとして中に入れて使うことはできないのです。

 たとえば、表の中で、改行をしようとして、編集画面で本当に改行してしまうと、思うような表示にはなりません。表がばらばらになってしまいます。
 これは、表の中で改行を入れてしまうことで、表のブロックを終了させてしまうからです。
 ですから、表の中での改行は、本当に編集画面で改行を入れるのではなくて、表を崩さずに、表のブロックの中で、インライン要素として改行の働きをする、「&br;」を使わなければいけないのです。
 この改行の使い方の具体例は、リンクの説明を見てください。

ブロック要素補足

 ブロック要素となるプラグインは「#〜」の形式になっています。
 また、「空行はトップレベルのブロック要素の区切り」になります。つまり、空行が現われると、すべてのブロック要素は終了します。
 しかし、リスト構造と引用文は他のブロック要素を子要素にすることができるそうです。子要素のブロック要素は親要素のレベルに従ってインデント(字下げ)されて表示されます。

#html{{  }}を表の中で使えないわけ

 たとえば表の中でこの「#html{{  }}」を使おうとしてもうまくはいきません。

 それは、「#html{{  }}」が、ブロック要素だからです。
 理屈が分かってしまえば、できない理由も納得がいきます。

インライン要素  

 インライン要素は、必ずブロック要素の子要素になります。
 インライン要素となるプラグインは「&〜;」の形式になっています。

ブロック要素とインライン要素との両方があるタグ

 タグの中には、「#br」のように、「#〜」で始まるタグと、「&〜;」で始まるタグとの両方がある場合があります。
 この場合、これら二つの要素の性質の違いをきちんと把握して、しっかりと使い分けましょう。