Html5-attributes
提供：Dev Guides
HTML5-属性
前の章で説明したように、要素には、要素のさまざまなプロパティを設定するために使用される属性が含まれる場合があります。
一部の属性はグローバルに定義され、任意の要素で使用できますが、他の属性は特定の要素に対してのみ定義されます。 すべての属性には名前と値があり、以下の例のようになります。
以下は、「example」の値を使用してclassという名前の属性でdiv要素をマークアップする方法を示すHTML5属性の例です-
<div class = "example">...</div>属性は*開始タグ*内でのみ指定でき、*終了タグ*で使用することはできません。
HTML5属性は大文字と小文字を区別せず、すべて大文字または大文字と小文字を混在させて記述できますが、最も一般的な規則は小文字を使用することです。
標準属性
以下にリストされている属性は、ほぼすべてのHTML 5タグでサポートされています。
| Attribute | Options | Function |
|---|---|---|
| accesskey | User Defined | Specifies a keyboard shortcut to access an element. |
| align | right, left, center | Horizontally aligns tags |
| background | URL | Places an background image behind an element |
| bgcolor | numeric, hexidecimal, RGB values | Places a background color behind an element |
| class | User Defined | Classifies an element for use with Cascading Style Sheets. |
| contenteditable | true, false | Specifies if the user can edit the element’s content or not. |
| contextmenu | Menu id | Specifies the context menu for an element. |
| data-XXXX | User Defined | Custom attributes. Authors of a HTML document can define their own attributes. Must start with "data-". |
| draggable | true,false, auto | Specifies whether or not a user is allowed to drag an element. |
| height | Numeric Value | Specifies the height of tables, images, or table cells. |
| hidden | hidden | Specifies whether element should be visible or not. |
| id | User Defined | Names an element for use with Cascading Style Sheets. |
| item | List of elements | Used to group elements. |
| itemprop | List of items | Used to group items. |
| spellcheck | true, false | Specifies if the element must have it’s spelling or grammar checked. |
| style | CSS Style sheet | Specifies an inline style for an element. |
| subject | User define id | Specifies the element’s corresponding item. |
| tabindex | Tab number | Specifies the tab order of an element. |
| title | User Defined | "Pop-up" title for your elements. |
| valign | top, middle, bottom | Vertically aligns tags within an HTML element. |
| width | Numeric Value | Specifies the width of tables, images, or table cells. |
HTML5タグと関連する属性の完全なリストについては、リンク：/html5/html5_tags [HTML5タグ]への参照を確認してください。
カスタム属性
HTML 5で導入された新しい機能は、カスタムデータ属性の追加です。
カスタムデータ属性は data- で始まり、要件に基づいて名前が付けられます。 これは簡単な例です-
<div class = "example" data-subject = "physics" data-level = "complex">
...
</div>上記のコードは、_datasubject_および_data-level_と呼ばれる2つのカスタム属性を持つ完全に有効なHTML5です。 標準の属性の場合と同様の方法で、JavaScript APIまたはCSSを使用してこれらの属性の値を取得できます。
