HTML入門 | HTMLテキスト要素 | 段落(Paragraphs)

段落(Paragraph) <p>

<p>タグと</p>タグの間に位置する内容が、1つの段落を構成する。

<p>これは段落です。</p>
<p>これは別の段落です。</p>

コード実行

align属性値

属性値 説明
default 整列していない段落は基本的に左揃え。
left 左揃え。整列を指定しなければ基本的に左揃えになるため、あまり使用しない。
center 中央揃え。
right 右揃え。
justify 両端揃え。1つの段落が長くなり画面の端で自動改行が起きるとき、その端の部分を一定にそろえる機能である。一見すると左揃え、つまり基本整列と似ているが、改行が起きた右端を比較すると違いを確認できる。

<p>タグの上下には、少しの余白(margin)が自動的に挿入される。

書式をそのまま表示 <pre>

HTMLで作成したテキスト書式をそのまま表現するには、<pre>、preformatted textタグを使用する。 <pre>タグ内に書かれたテキストのすべての空白と改行は、Webブラウザにそのまま表示される。

<pre>
つつじの花

私を見るのが嫌になって
去っていくときには
何も言わず静かに見送ります。

寧辺の薬山の
つつじの花
一抱え摘んで、行く道に撒きましょう。
</pre>

コード実行

改行 <br>

HTMLでは、<br>、Line Breaksタグを使用して改行できる。

<p>この段落は<br>改行を<br>含んでいます。</p>

コード実行

水平区切り線 <hr>

段落を分けるときや、内容上の区切りを表現したいときに水平区切り線を使用する。 このように使用される水平区切り線は、HTMLコードでは<hr>タグ、horizontal ruleで簡単に作成できる。

<p>ここは1つの段落です。</p>
<hr>
<p>ここは1つの段落です。</p>
<hr>
<p>ここは1つの段落です。</p>

コード実行