HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

HTMLで改行タグを正しく使う方法：<br>、<br/>、<br />の違いと使い分け

HTMLにおけるbrタグの基本

HTMLで改行を挿入する際に使用されるのが<br>タグです。このタグは「空要素（empty element）」と呼ばれ、終了タグを必要としません。そのため、単に<br>と記述するだけで正常に機能します。

一方で、<br/>や<br />といった書き方を目にしたことがある方も多いでしょう。それぞれの違いと正しい使い方を見ていきましょう。

HTMLとXHTMLでの正しい書き方

HTMLの場合

標準的なHTML文書では、<br>タグを使用するのが正しい方法です。スラッシュなしのシンプルな形式で問題ありません。

XHTMLの場合

XHTMLの仕様では、すべてのタグを閉じる必要があるため、<br/>または<br></br>という形式が有効とされています。これはXHTMLガイドラインに基づくルールです。

W3Cガイドラインによる推奨事項

W3Cのガイドラインでは、空要素の末尾にあるスラッシュ（/）と閉じ括弧（>）の間に半角スペースを1つ入れることが推奨されています。つまり、<br />のように記述するのが望ましい形です。

このルールは、既存のHTMLユーザーエージェント（ブラウザ）でもXHTML文書が正しく表示されるようにするための配慮として定められています。古いブラウザの中には、「/>」という並びを正しく解釈できないものがあり、スペースを挟むことで互換性が向上するのです。

実装サンプル

以下のコードを実行して、<br>タグの実際の動作を確認してみましょう。

サンプルコード

<!DOCTYPE html>
<html>
    <head>
        <title>HTML br タグの例</title>
    </head>
    <body>
        <p>ここは改行前のテキストです<br>
            ここは改行後のテキストです。
        </p>
    </body>
</html>

まとめ

  • HTMLでは <br> を使用する
  • XHTMLでは <br/> または <br></br> を使用する
  • W3C推奨の互換性重視の書き方は <br />（スラッシュ前に半角スペース）

現在のHTML5が主流の環境では、シンプルな<br>を使えば十分ですが、XHTMLとの互換性が必要な場面では<br />を選択するとよいでしょう。プロジェクトの要件に合わせて適切な形式を使い分けることが大切です。

  1. HTMLのcenterタグとは？中央揃えの基本とCSSでの代替方法を解説

    HTMLの<center>タグは、テキストやコンテンツを水平方向に中央揃えで表示するための要素です。かつては見出しや段落、表などをページの中央に配置する際に広く使われていました。 注意：<center>タグはHTML5では廃止されており、最新のWeb制作では使用が推奨されません。中央揃えを実装したい場合は、CSSを使うことが公式にも提案されています。 centerタグが非推奨となった理由 <center>タグは、「文書の構造」と「見た目の装飾」を分離するというHTMLの設計思想に反するため、HTML5で廃止されました。レイアウトやデザインに関する指定はす

  2. HTMLのcolgroupタグとは？テーブルの列をまとめてスタイルする方法

    <colgroup>タグとは<colgroup>タグは、HTMLテーブル内の1つ以上の列（カラム）をひとつのグループとしてまとめるための要素です。このタグを使うことで、グループに含まれるすべての列に対して、まとめてスタイルを適用できます。セルや行ごとに個別にスタイルを記述する必要がないため、コードがすっきりし、テーブル全体のデザイン管理も効率的になります。主な属性span − 列グループが対象とする列の数を指定します。たとえば「span=3」と設定すると、先頭から3列分が同じグループとして扱われます。使用例それでは、<colgroup>タグを使った実際の実装