HTML の <br> 要素 は、文中に改行（キャリッジリターン）を生成します。詩や住所など、行の分割が重要な場合に有用です。
この対話型サンプルのソースファイルは GitHub リポジトリに格納されています。対話型サンプルプロジェクトに協力したい場合は、 https://github.com/mdn/interactive-examples をクローンしてプルリクエストを送信してください。
上記の例に見られるように、 <br> 要素はテキストを改行したい場所にそれぞれ含められます。 <br> の後のテキストは、テキストブロックの次の行の先頭から再開されます。
属性
この要素はグローバル属性を持ちます。
非推奨の属性
clear- 改行後の次の行を開始する場所を示します。
CSS でのスタイル付け
<br> 要素は、テキストのブロック内で改行するという、単一の明確な目的を持っています。そのため、寸法を持たず、自身が表示されることもなく、スタイル付けすることができるのはわずかです。
<br> 要素自体に margin を設定して、ブロック内のテキストの行間を開けることができますが、これは良いやり方ではありません。 — この用途のために設計された line-height プロパティを使用してください。
例
単純な br
以下の例では <br> を使用して、住所のそれぞれの行の間に改行を生成しています。
Mozilla Foundation<br> 331 E. Evelyn Avenue<br> Mountain View, CA<br> 94041<br> USA<br>
以下のように出力されます。
アクセシビリティの考慮事項
段落間の間隔を広げるために連続した <br> 要素を使用することは、読み上げ技術の支援の下で操作をしている人にとっては問題になります。読み上げソフトは要素が存在することをアナウンスするものの、その中にはコンテンツが何もないという状況になる可能性があります。これは読み上げソフトを使用している人の利用を混乱させ不満をためる可能性があります。
追加の間隔をあける必要がある場合は、 margin のような CSS プロパティを使用して効果を得るようにしてください。
技術的概要
| コンテンツカテゴリ | フローコンテンツ、記述コンテンツ |
|---|---|
| 許可されている内容 | なし。これは空要素です。 |
| タグの省略 | 開始タグは必須で、終了タグを記述してはなりません。 XHTML 文書では、この要素は <br /> と書きます。 |
| 許可されている親要素 | 記述コンテンツを受け入れるすべての要素 |
| 許可されている ARIA ロール | すべて |
| DOM インターフェイス | HTMLBRElement |
仕様書
| 仕様書 | 状態 | 備考 |
|---|---|---|
| HTML Living Standard <br> の定義 |
現行の標準 | |
| HTML5 <br> の定義 |
勧告 | |
| HTML 4.01 Specification <br> の定義 |
勧告 |
ブラウザーの対応
このページの互換性一覧表は構造化データから生成されています。データに協力したいのであれば、 https://github.com/mdn/browser-compat-data をチェックアウトしてプルリクエストを送信してください。
| 機能 | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| 基本対応 | 1 | あり | 1 | あり | あり | あり |
clear | 1 | あり | 1 | あり | あり | あり |
| 機能 | Android webview | Chrome for Android | Edge mobile | Firefox for Android | Opera Android | iOS Safari | Samsung Internet |
|---|---|---|---|---|---|---|---|
| 基本対応 | あり | あり | あり | 4 | あり | あり | あり |
clear | あり | あり | あり | 4 | あり | あり | あり |