仕様

HTML要素は、
HTML文書の基点(ルート)を
表します。

html基点 (document root element)
カテゴリなし
種類通常要素
この要素を
使用できる
状態
文書ドキュメント要素として。
複合文書内でサブドキュメントフラグメントが許可されている場所。
許可されて
いる内容
ひとつの head要素と、それに続くひとつの body要素
属性グローバル属性のみ
manifest属性がありますが、従来の「オフラインWebアプリケーション」機能の一部であり、Webプラットフォームから削除される過程にあります。
text / html
での
タグの省略
開始タグは、html要素内の最初のものがコメントでない場合は省略可能です。
終了タグは、html要素の直後にコメントが続かない場合は省略可能です。
許可されて
いるARIA
なし
DOM
インター
フェイス
HTMLHtmlElement
  1. [Exposed=Window]
  2. interface HTMLHtmlElement : HTMLElement {
  3. [HTMLConstructor] constructor();
  4. };
  5.  
  6. interface HTMLElement : Element {
  7. [HTMLConstructor] constructor();
  8.  
  9. // metadata attributes
  10. [CEReactions] attribute DOMString title;
  11. [CEReactions] attribute DOMString lang;
  12. [CEReactions] attribute boolean translate;
  13. [CEReactions] attribute DOMString dir;
  14.  
  15. // user interaction
  16. [CEReactions] attribute boolean hidden;
  17. undefined click();
  18. [CEReactions] attribute DOMString accessKey;
  19. readonly attribute DOMString accessKeyLabel;
  20. [CEReactions] attribute boolean draggable;
  21. [CEReactions] attribute boolean spellcheck;
  22. [CEReactions] attribute DOMString autocapitalize;
  23.  
  24. [CEReactions] attribute [LegacyNullToEmptyString] DOMString innerText;
  25.  
  26. ElementInternals attachInternals();
  27. };
  28.  
  29. HTMLElement includes GlobalEventHandlers;
  30. HTMLElement includes DocumentAndElementEventHandlers;
  31. HTMLElement includes ElementContentEditable;
  32. HTMLElement includes HTMLOrSVGElement;
レンダリング
ページ
  1. html {
  2. display: block;
  3. }

CSS を大雑把に読むと、 フローレイアウトに配置されたときにブロックレベルのボックスを生成します。 などになります。

参加
コンテキスト
ブロックフォーマットコンテキスト (ルート要素なので、実際にはない)
確立
コンテキスト
ブロックフォーマットコンテキスト
html要素は、HTML文書基点(ルート)を表します。

作成者は、ルートhtml要素に lang属性を指定して、文書(ドキュメント)の言語を指定することをお勧めします。 これは、使用する発音を決定する音声合成ツール、使用する規則を決定する翻訳ツールなどを支援します。

  1. <!DOCTYPE html>
  2. <html lang="ja">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>離珠のHTMLでしぃ!</title>
  6. </head>
  7. <body>
  8. </body>
  9. </html>
参照元
  1. HTML Living Standard. 4.1.1 The html element
  2. HTML Living Standard. 15 Rendering 15.3.2 The page
  3. HTML 5.2 W3C 勧告. 4.1.1 The html element
  4. HTML 4.01 Specification W3C 勧告. 7.3 The HTML element
  5. MDN Web Docs. HTML <html>: HTML 文書 / ルート要素

使用可能な箇所

html要素を使用できる状態(コンテキスト)は、文書ドキュメント要素として、または複合文書内でサブドキュメントフラグメントが許可されている場所で記述が可能です。


配置できるコンテンツ

head要素と
body要素を
配置できます。

html要素[内容(コンテンツ)]として、ひとつの head要素と、それに続くひとつの body要素を配置できます。尚、head要素body要素ともにタグの省略が可能なので、ソース上の見た目には注意かと思います。

  1. <!DOCTYPE html>
  2. <html lang="ja">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>離珠のHTMLでしぃ!</title>
  6. </head>
  7. <body>
  8. </body>
  9. </html>

1つの head要素とそれに続く1つの body要素を配置できます。

  1. <!DOCTYPE html>
  2. <html lang="ja">
  3. <meta charset="UTF-8">
  4. <title>離珠のHTMLでしぃ!</title>
  5. <p>タグが省略された例</p>
  6. </html>

head要素body要素ともにタグの省略が可能であり、タグの省略であって要素自体は存在しています。ここでの p要素は、html要素の孫の位置に配置されていて子の位置ではありません。スクリプトやスタイルシートの指定では注意が必要です。


属性

manifest属性がありますが、従来の「オフラインWebアプリケーション」機能の一部であり、Webプラットフォームから削除される過程にあります。

lang属性

  1. <html lang="ja">

lang属性は、要素言語を設定します。編集不可の要素では記述されている言語を、また編集可能な要素ではユーザーが書き込むべき言語を定義するグローバル属性です。
その値は、有効な言語タグ、または空の文字列である必要があります。属性空の文字列に設定すると、1次言語が不明であることを示します。これらの属性要素から省略されている場合、この要素言語は、その最も近い祖先要素言語を保持している要素言語と同じです。

この例では、"ja"(日本語) を html要素に指定しています。html要素lang属性を省略すると、html要素祖先要素がないので1次言語が不明となります。その為、html要素lang属性を記述する事をお勧めします。


気を付ける点

タグの省略

html要素タグは省略可能です。html要素に記述できる head要素, body要素タグは省略可能です。なのでソースコードを読む時にタグが省略されている可能性も意識して読む必要があります。
また記述する側としては、html要素開始タグを省略するという事は lang属性を省略するという事でもある事を留意して記述する必要があると思います。

  1. <!DOCTYPE html>
  2. <title>離珠のHTMLでしぃ!</title>
  3. <h1>離珠のHTMLでしぃ!</h1>
  4. タグを省略しています。

タグの記述を省略しているだけで、要素は存在しています。

基点要素

html要素基点要素であるので、その性質は文書全体の内容に影響します。性質は、属性の指定や CSS の指定により指定できます。

CSSリセット

  1. html {
  2. line-height: 1.15;
  3. -webkit-text-size-adjust: 100%;
  4. }

normalize.css というリセットCSS の一部です。すべてのブラウザで行の高さを修正します。 iOSで向きを変更した後のフォントサイズの調整を防止します。
詳細は理解していないのですが、いろいろとバグ等の対応も含んでいる様なので、リセットCSSを利用する事をお勧めします。