テキストのレイアウト

テキストの改行

• テキストは、ブラウザの端までいくと自動的に改行して表示されるようになっている。
• これは便利な機能のようでいて、実際は、ブラウザの幅を変えるとそのつど自動的に改行される箇所が変わるということであり、画面のレイアウトという点からは不都合な面も多い。
• そのためレイアウトの乱れを防ぐためには、改行を示すタグを効果的に用いるなどの工夫をするとよい。

<BR>

• 行間を空けずに改行する。
• エンプティタグ(終了タグが必要ないタグ)である。

【例】

<P> ～ </P>

• パラグラフ(段落)であることを示すタグ。
• 改行し、改行後に続くテキストとの間に行間をあける。
• 行間をあける目的で、<P>タグを連続して用いても、通常、1つ分しか効かない。

【例1】

【例2】

<PRE>～</PRE>

• HTML文書内で書かれたとおりの改行で表示する。
• 文字幅や空白は、等幅フォントで表わされる。

【例】

	    　ここに書いてあるのと同じ
        　　改行のしかたで表示されます。
      

	    　ここに書いてあるのと同じ
        　　改行のしかたで表示されます。
    

テキストの揃いを決める

ALIGN="X"

• 段落ごとにテキストの揃いを指定する。
• <P>タグのアトリビュート。
• ただしこれらのアトリビュートを用いたときは、<P>タグは開始タグと終了タグではさむやり方で使用する。
• Xには、Left、Center、Rightが入る。

【例1】段落を左揃えにする場合

• ただし普通は、何も設定しなくても、左揃えになる。

【例2】段落を中央揃えにする場合

【例3】段落を右揃えにする場合

行の左右の端を下げる(ブロック引用)

<BLOCKQUOTE> ～ </BLOCKQUOTE>

• 段落の左右の端が、数文字分下がります。
• このタグを指定した段落の前後に、1行分の間隔が空きます。

【例】

テキストのレイアウト