コンテンツにスキップ

HTML/タグの省略

リンクを追加
出典: フリー教科書『ウィキブックス（Wikibooks）』
idとclass HTML
タグの省略 		ラベル

HTML5

[編集]

HTML5では、一部のタグを省略することが許可されています。これは、HTMLパーサーが文書構造を解析して不足しているタグを推測する能力を持っているためです。以下に、省略可能なタグとその条件を示します。

<html> タグ

[編集]
省略可能な条件

<html>タグは省略可能です。ブラウザはドキュメントの最初と最後を自動的に<html>タグと見なします。

例
<!DOCTYPE html>
<head>
    <title>省略可能なタグの例</title>
</head>
<body>
    <p>この例では、<code>&lt;html&gt;</code>タグが省略されています。</p>
</body>

<head> タグ

[編集]
省略可能な条件

<head>タグは省略可能ですが、その内容（例えば、<title>タグ）は省略できません。

例
<!DOCTYPE html>
<html>
<title>省略可能なタグの例</title>
<body>
    <p>この例では、<code>&lt;head&gt;</code>タグが省略されています。</p>
</body>
</html>

<body> タグ

[編集]
省略可能な条件

<body>タグは省略可能です。ブラウザは<body>タグの内容を自動的に本文として認識します。

例
<!DOCTYPE html>
<html>
<head>
    <title>省略可能なタグの例</title>
</head>
<p>この例では、<code>&lt;body&gt;</code>タグが省略されています。</p>
</html>

極端な省略

[編集]
例
<!DOCTYPE html>
<title>極端な省略の例</title>
<p>この例では、<code>&lt;html&gt;</code>タグ、<code>&lt;head&gt;</code>タグと<code>&lt;body&gt;</code>タグが省略されています。

この例は、極端ですが有効なHTML5の文章です。 ただし lang 属性を指定していないなど実用上の不備は考えられるので、一度しか登場しない上位要素を無理に省略するメリットは希薄です。

ブロックレベル要素の閉じタグ

[編集]
省略可能な条件
一部のブロックレベル要素（例：<li>, <dt>, <dd>, <td>, <th>, <p>）は、次の要素が来るときに閉じタグを省略できます。
例
<!DOCTYPE html>
<html>
<head>
    <title>省略可能なタグの例</title>
</head>
<body>
    <ul>
        <li>アイテム1
        <li>アイテム2
        <li>アイテム3
    </ul>
    <p>この段落は閉じタグなしで終了します
    <p>新しい段落が開始されます
</body>
</html>

<!DOCTYPE html> 宣言

[編集]
必須

HTML5のドキュメントを宣言するための<!DOCTYPE html>は省略できません。

<colgroup> タグ

[編集]
省略可能な条件

<colgroup>タグが唯一の<col>要素を含む場合、その終了タグを省略できます。

例
<!DOCTYPE html>
<html>
<head>
    <title>省略可能なタグの例</title>
</head>
<body>
    <table>
        <colgroup>
            <col style="background-color: red">
        <!-- </colgroup> タグが省略されています -->
        <tr><td>データ1<!-- </td> タグが省略されています --></tr>
    </table>
</body>
</html>

まとめ

[編集]

HTML5では、いくつかのタグを省略することができますが、これを行う際には注意が必要です。省略されたタグが意図した通りに解釈されることを確認するために、テストを行うことが重要です。省略可能なタグを適切に理解し、使用することで、HTMLドキュメントを簡潔に保つことができます。

HTTML 4.01

[編集]

HTML 4.01ではSGML宣言で「OMITTAG YES」と宣言されているため、SGMLの省略タグ機構（要素の開始タグ及び終了タグは, そのタグの省略によってあいまいさが生じないときに限り省略できる仕組み）を用いることができる。SGMLの省略タグ機構では、タグの省略ができる場合の条件はいくつかあるが、HTML 4.01では次の2つだけを覚えておけば問題ない。

  • DTDでタグの省略が許可されている
  • タグを省略した場合でも文書構造が一意に定まる

ただし、文書構造が一意に定まるか否かについても、厳密にはSGMLの省略タグ機構を完全に理解していなければ判断できないことも多い点には注意が必要である。

タグの省略の例

[編集]

はじめに、タグを省略したHTML文書の例を示す。次のHTML文書はHTML 4.01 Strictとして妥当である。 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
          "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>タグの省略の例</title>
<p>タグの省略の例。
<p>HTMLではタグの省略が可能。

このHTML文書で省略されたタグを補完すると次のようになる。 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
          "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>タグの省略の例</title>
  </head>
  <body>
    <p>タグの省略の例。</p>
    <p>HTMLではタグの省略が可能。</p>
  </body>
</html>

脚註

[編集]


idとclass HTML
タグの省略 		ラベル
"https://ja.wikibooks.org/w/index.php?title=HTML/タグの省略&oldid=251525" より作成