グローバル属性（2/3）
dirコンテンツ属性（テキストの方向性）
| 指定可能な値 | 説明 |
|---|---|
| dir="ltr" | テキストの方向性を左から右へ向かう方向にする |
| dir="rtl" | テキストの方向性を右から左へ向かう方向にする |
dirコンテンツ属性は、要素のコンテンツの方向を指定することができる列挙属性です。通常、日本語のサイトで、このコンテンツ属性を使うことは稀だと言えますが、ページの一部にアラビア文字など右から左へ読む言語をマークアップしたい場合に使います。
■利用例
<p>アラビア語の<span dir="rtl" lang="ar">شُكْرًا</span>（シュクラン）は
「ありがとう」という意味です。</p>
■ブラウザでのレンダリング結果（Chromeの場合）
draggableコンテンツ属性（ドラッグ有効化）
| 指定可能な値 | 説明 |
|---|---|
| draggable="true" | 該当の要素をドラッグ可能にする |
| draggable="false" | 該当の要素をドラッグ不可にする |
要素がドラッグ可能になるというのは、マウスで要素をクリックしたまま、マウスを動かすことで、その要素を移動する状態を再現することを表します。
HTML5仕様では、img要素とhrefコンテンツ属性がセットされたa要素のみが、デフォルトでドラッグ可能であると規定しています。実際に、このコンテンツ属性をセットしてドラッグ可能にしただけでは、役に立つことはありません。JavaScriptと組み合わせて、アクションを用意する必要があります。
hiddenコンテンツ属性（無関係・無意味を表す）
| 指定可能な値 | 説明 |
|---|---|
| hidden="hidden" | 該当の要素を隠すために使う論理属性 |
hiddenコンテンツ属性は論理属性で、この属性がセットされた要素は、無関係もしくは無意味であることを表します。ブラウザのレンダリングにおいても、表示されません。
このコンテンツ属性は、無関係・無意味というセマンティクスを与え、将来的にコンテンツ属性に対応したブラウザが出た時には、スタイルシートが無効だったとしても、非表示となるはずです。したがって、ある条件において、意味的になくなるべきコンテンツについては、hiddenコンテンツ属性を指定するべきです。
■利用例
<p><label>
<input type="checkbox" id="user" name="user" value="1"
onclick="showUserName()" />会員</label></p>
<p hidden="hidden"><label>氏名
<input id="uname" type="text" name="uname" /></label></p>
利用例では、会員のチェックボックスにチェックを入れると、氏名欄のテキストボックスが表示されるようにしています。つまり、会員でなければ、氏名欄は意味がないということになります。
id要素（要素の識別子）
| 指定可能な値 | 説明 |
|---|---|
| id="任意の値" | 要素の識別子を指定 |
idコンテンツ属性は、要素の識別子を指定します。同じドキュメント内に、同じidコンテンツ属性の値を持った要素が存在してはいけません。また、idコンテンツ属性には、スペース文字を含めることはできません。
idコンテンツ属性は、主にスタイルシートのフックに使ったり、スクリプトから要素を指定するために使います。また、ドキュメント内のアンカーとしても利用できます。
■利用例
<ul> <li><a href="#w1">ワーク1</a></li> <li><a href="#w2">ワーク2</a></li> </ul> ・・・・・・・・ <section> <h2 id="w1">ワーク1とは</h2> ・・・・・ </section> <section> <h2 id="w2">ワーク2とは</h2> ・・・・・ </section>
利用例は、ドキュメント内の特定の箇所へのリンクを設定したものです。a要素の値にはidコンテンツ属性の値の頭にシャープ「#」を付けてマークアップします。
lang要素（言語）
| 指定可能な値 | 説明 |
|---|---|
| lang="言語コード" | 該当の要素のコンテンツの言語を、言語コードで指定する |
langコンテンツ属性は、該当の要素のコンテンツの主となる言語を表す言語コードを指定します。langコンテンツ属性に指定するコードは、IETF BCP47 "Matching of Language Tags"に従わなければなりませんが、これまでに使われていた言語コードと同じです。日本語であればja、米国英語であればen-USとなります。
■利用例
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8" /> <title>タイトル</title> </head> <body> <h1>「こんにちは」の言葉</h1> <dl> <dt lang="en">英語</dt> <dd>Hello</dd> <dt lang="fr">フランス語</dt> <dd>Bonjour</dd> <dt lang="de">ドイツ語</dt> <dd>Hallo</dd> <dt lang="it">イタリア語</dt> <dd>Ciao</dd> </dl> </body> </html>
利用例では、html要素のlangコンテンツ属性は、コンテンツ全体の言語を指定しています。dt要素のlangコンテンツ属性は、そのコンテンツに応じた言語コードをセットしています。
HTML5仕様では、もしlangコンテンツ属性がセットされていなければ、langコンテンツ属性がセットされている直近の親要素の言語が適用されます。もし、html要素にlangコンテンツ属性がセットされていない場合は、meta要素が参照されます。
<meta http-equiv="Content-Language" content="ja" />
さらに、meta要素にも言語コードが指定されていなかったら、上位レベル・プロトコルのレスポンス・ヘッダが参照されます。このヘッダに言語を表すものがあれば、それが適用されますが、ない場合は該当のドキュメントの言語は不明だとして扱われます。HTML5では、html要素にlangコンテンツ属性をセットすることが推奨されています。
【各要素のリファレンス24】