p要素 文章の段落を示す
p要素は文章の中で段落を示します。paragraph(「段落」の意味)の頭文字の pです。
長い文章があってそれを段落に分けたい時、それぞれ分ける部分を pタグで囲むことで、それらは段落として扱われます。
ここでは、p要素の概要や、Pタグによってどう表示されるのかを説明します。
p要素の概要
- HTML5での分類
- フロー・コンテンツ
- 書式
- <p>段落単位の文章</p>
- 指定できる属性
- グローバル属性
- 子要素にできるもの
- フレージング・コンテンツ
p要素は文章を段落で区切る際に使用します。文章は、読みやすくする為に段落で区切りますが、1つの段落に対して1対の pタグで囲みます。
p要素の使用例
文章の中で、pタグで囲んだ部分が段落となります。
次のような文章があるとします。
<p>あいうえおかきくけこ。</p>
「あいうえおかきくけこ。」という1文を pタグで囲んで1つの段落としています。この場合次のように表示されます。
あいうえおかきくけこ。
これを、「あいうえお。」と「かきくけこ。」という2つの段落に分ける時は、それぞれを pタグで囲みます。
<p>あいうえお。</p>
<p>かきくけこ。</p>
このようにマークアップすることで、2つの段落に分かれて表示されます。
あいうえお。 かきくけこ。
pタグは、以前で言うブロックレベルの挙動をします。pタグで囲んだ部分は1つのブロックとして、表示領域を横幅いっぱいにとります。
よって、pタグで囲んだ文章は、前後に改行が入ったようなレイアウトとなり、段落として表示されます。
まとめ
p要素は、文章の段落を示す為に用います。ブログでは必ず文章を書きます。ということは同時に段落もできるので、p要素は最も使う要素と言えるでしょう。
段落としたいひとまとまりを pタグで囲みます。
pタグはブロックレベルの挙動をしますので、中のコンテンツは改行された状態で表示されます。