<p>タグは、段落を指定するのに使用する要素で、段落の意味を持つparagraphの略です。今回は、HTML5における<p>タグの使い方をご紹介します。
HTML5における<p>タグの使い方
<p>要素は、段落を指定する際に使用します。
1 |
<p>〜</p> |
上記の記述で文章中の段落を囲むことで、区切りをつけることができます。ただ文章を入力しただけでは、下の画像のように表示されてしまいます。
そこで、「区切りです。」を境に<p>タグで囲んでみたのが、下のサンプルコードです。
1 2 3 4 |
<p>TEXTTEXTTEXTTEXTTEXTTEXT、区切りです。 </p> <p>TEXTTEXTTEXTTEXTTEXTTEXT。 </p> |
表示サンプルです。
<p>タグで区切った部分で段落として表示されています。
また、CSSで段落の横幅などを使用すると、より便利に<p>要素を利用することができます。下のサンプルコードでは、P要素の文字色を赤に、横幅を100pxに指定してみました。
1 2 3 4 |
p { color: red; width: 100px; } |
表示サンプルです。
段落で区切られつつ、色や横幅の設定が追加されるようになりました。