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