Perl Web開発者のHTML・CSS入門

【HTML5】pタグ - 段落を作成する

pタグを使うと段落を作成することができます。

こちら

食べ放題。

  <p>
    こちら
  </p>
  <p>
    食べ放題。
  </p>

pタグとdivタグとbrタグの使い分けは?

brタグやdivタグを使っても改行ができますね。pタグとdivタグとbrタグの使い分けは、実際には、どんな感じでしょう?

こちら<br>
食べ放題。

「それぞれを使い分けますか?」という質問には、はいと答えます。

本文を書く場合はpタグ

本文を書くような場合は、pタグを使います。

こんなお店で良かったのかな。

ええ、とても楽しかったわよ。

<p>
  こんなお店で良かったのかな。
</p>
<p>
  ええ、とても楽しかったわよ。
</p>

ボタンやテーブルの項目などの中で改行はbrタグ

ボタンやテーブルの項目など、本文ではないような場所で、改行したい場合は、brタグを使うことがあります。

この
ボタン

<button>この<br>ボタン</button>

テキストの装飾を変えたい場合はdivタグ

テキストの装飾を変えたい場合は、divタグを使うことも多いです。

この

ボタン

<button>
  <div style="color:red">この</div>
  <div style="font-weight:bold;">ボタン</div>
</button>