文章の整形


　エディタで、改行したり、段落をつけたり、スペースを空けたりetc...して文章をレイアウトしても、 ブラウザ上では、それが全く反映されません。タグを使わなけらばならないのです。 例えば、エディタで次のように打ち込んでも、

だんでぃだんでぃだんでぃだんでぃだんでぃだんでぃ。 ＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹ。

50音
あいうえおかきくけこさしすせそたちつてと
なにぬねのはひふへほまみむめもやゆよわをん


ブラウザ上では、次のように表示されてしまいます。

だんでぃだんでぃだんでぃだんでぃだんでぃだんでぃ。 ＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹ。 50音 あいうえおかきくけこさしすせそたちつてと なにぬねのはひふへほまみむめもやゆよわをん


では、タグを使ってこの文章を整形していきましょう。まずは文章を段落に分けるタグです。

<P>だんでぃだんでぃだんでぃだんでぃだんでぃだんでぃ。 ＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹ。</P>

<P>50音
あいうえおかきくけこさしすせそたちつてと
なにぬねのはひふへほまみむめもやゆよわをん</P>


とすると、ブラウザ上ではこうなります。

だんでぃだんでぃだんでぃだんでぃだんでぃだんでぃ。 ＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹ。

50音 あいうえおかきくけこさしすせそたちつてと なにぬねのはひふへほまみむめもやゆよわをん



これだけでも、だいぶ見やすくなります。次に改行のタグを使ってみましょう。

<P>だんでぃだんでぃだんでぃだんでぃだんでぃだんでぃ。 ＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹ。</P>

<P>50音<BR>
あいうえおかきくけこさしすせそたちつてと<BR>
なにぬねのはひふへほまみむめもやゆよわをん</P>


ブラウザではこう表示されます。

だんでぃだんでぃだんでぃだんでぃだんでぃだんでぃ。 ＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹ。

50音
あいうえおかきくけこさしすせそたちつてと
なにぬねのはひふへほまみむめもやゆよわをん



また、次のようなタグも便利です。

<P>だんでぃだんでぃだんでぃだんでぃだんでぃだんでぃ。 ＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹ。</P>
<HR>
<P>50音<BR>
あいうえおかきくけこさしすせそたちつてと<BR>
なにぬねのはひふへほまみむめもやゆよわをん</P>


このタグを使うと次のように区切り線を入れることができます。

だんでぃだんでぃだんでぃだんでぃだんでぃだんでぃ。 ＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹ。

50音
あいうえおかきくけこさしすせそたちつてと
なにぬねのはひふへほまみむめもやゆよわをん



さて、デフォルトでは文章は左詰で表示されます。これを自分の好きな位置に表示するには次のようにします。

<P ALIGN=right>右詰に表示します。</P>
<P ALIGN=center>中央に表示します。</P>
<P ALIGN=left>左詰に表示します。</P>

右詰に表示します。

中央に表示します。

左詰に表示します。



また、次のタグでも中央に表示することができます。

<CENTER>中央に表示します。</CENTER>

中央に表示します。


　さて、ここまで文章を整形するためのいろいろなタグが出てきましたが、 これらを使うのが面倒くさいという人のためにこんなタグがあります。

<PRE>
だんでぃだんでぃだんでぃだんでぃだんでぃだんでぃ。 ＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹ。

50音
あいうえおかきくけこさしすせそたちつてと
なにぬねのはひふへほまみむめもやゆよわをん
</PRE> 

だんでぃだんでぃだんでぃだんでぃだんでぃだんでぃ。ＤＡＮＤＹＤＡ
ＮＤＹＤＡＮＤＹＤＡＮＤＹＤＡＮＤＹ。


                                    50音
あいうえおかきくけこさしすせそたちつてと
なにぬねのはひふへほまみむめもやゆよわをん


というふうに、<PRE>〜</PRE>に記述した部分は、ブラウザ上でも、 そのままの形で表示されます。 ただ、ご覧の通り他のタグを使ったときと比べて、 若干レイアウトやフォントサイズなどが変わるので微調整が必要です。

　では、次に文字の大きさや色を変えたり、文字を強調したりするタグを使ってみましょう。 こちらへどうぞ。