HTML辞書ホームへ
HTML要素 辞書 by Sentaro
<p>
段落(Paragraph)要素。文章の段落を示すための基本的なHTML要素です。
info
概要
<p> 要素(段落要素)は、テキストのブロックを段落としてグループ化するために使用されます。
Webコンテンツの大部分を占める標準的なテキストコンテンツであり、ブロックレベル要素です。ブラウザは通常、各 <p> 要素の前後に追加の余白(マージン)を自動的に挿入します。
play_circle
デモ (静的表示)
HTML (Source)
<p>
これは一つの段落です。
</p>
<p style="color: blue;">
スタイルを適用した別の段落。
</p>
Preview (Result)
これは一つの段落です。
スタイルを適用した別の段落。
list
属性 (Attributes)
| 属性名 | 説明 |
|---|---|
| グローバル属性 | <p> 要素には固有の属性はありませんが、すべてのHTML要素に適用できる**グローバル属性**(例: id, class, style, langなど)を使用できます。 |
| ... |
特にありません。 **非推奨の属性:** HTML4時代に存在した align 属性は廃止されました。これはCSSを使用して代替すべきです。
|
code
実用例
1. 基本的な段落の構成
<p>
最初の文です。一つの段落は一つのテーマを扱うべきです。
</p>
<p>
別の段落が続きます。これにより、文章の視覚的な区切りと、意味的な構造化が実現されます。
</p>
2. 段落内にインライン要素を配置
<p>
重要なキーワードには<strong>強調</strong>を使用し、
<a href="...">リンク</a>を作成できます。
</p>
3. ` ` の代わりに `
` を連続使用することの回避
<!-- 推奨される正しい書き方 -->
<p>段落1</p>
<p>段落2</p>
<!-- 避けるべき間違った書き方 -->
<div>段落1<br><br>段落2</div>
lightbulb
知っておくべき重要事項
article
セマンティクス(意味)に関する注意
文章の段落ではない、単なる視覚的な区切りを作るためだけに
文章の段落ではない、単なる視覚的な区切りを作るためだけに
<p> 要素を使用するのは避けるべきです。リストの項目には <li>、住所には <address> など、コンテンツの目的に合ったセマンティックな要素を使用しましょう。
accessibility_new
コンテンツの制約
<p> 要素は**ブロックレベル要素**(例: <div>, <h1>, <ul>)を子要素として含むことはできません。段落の中にはインライン要素(例: <span>, <a>, <strong>)のみを配置することがHTMLの仕様で定められています。