HTMLを理解するために知っておきたい用語

HTML

HTML入門

要素と属性

HTMLを理解する上で欠かせない専門用語はたくさんありますが、まずは以下の用語について知っておきましょう。

  • 要素
  • 開始タグ・終了タグ
  • 内容(要素内容)

要素=開始タグ+内容+終了タグ

開始タグは開始を示すタグで、終了タグは終了を示すタグです。また、要素はタグによって囲われた範囲全体のことです。内容(要素内容)は要素からタグを除いた部分のことです。

HTMLで欠かせない専門用語 要素
要素について

上の例のタグの内部(<と>の間)にあるh1はその要素を表す名前(要素名)となります。つまり、HTMLでは開始タグは<要素名>のように記述し、終了タグは</要素名>のように「/」を付けて記述します(例外もあります)。

このように記述された要素は、要素名を使ってh1要素p要素のように呼ばれます。

なお、要素の中には内容と終了タグを持たないものもあるので注意しましょう。これらは、空要素と呼ばれ、開始タグのみで1つの要素を表します。

空要素には、たとえば画像を表示させるimg要素や、改行を表すbr要素などがあります。

属性=属性名+値

  • 属性
  • 属性名・値

開始タグの要素名の直後には、半角スペースで区切って属性というものを記述することができます。

属性は、基本的には属性名="値"の形式で記述し、要素の性質や特性などを表すために使用します。属性は、半角スペースで区切ることで1つの開始タグの中で複数指定できます。指定する順序は自由です。

HTMLで欠かせない専門用語 属性
属性について

属性の値を囲う引用符には「"」だけでなく「’」を使うこともできます。ただし、同じ種類の引用符で値を挟むようにして使う必要があります。

グローバル属性

各要素に指定可能な属性は、要素ごとに予め決められています。しかし、属性の中には、どの要素にでも共通して指定可能なものもあり、それらはグローバル属性と呼ばれています。

HTML5.1で定義されているグローバル属性は、次の15種類です。

属性名説明
accesskey半角英数字または記号キーボードショートカットに使用する1文字を指定。
class種類を表す名前半角スペースで区切って複数の名前を指定できる。名前の重複可。
contenteditabletrueまたはfalse編集の可・不可を指定。true(編集可)、false(編集不可)。
contextmenuメニューのidメニューとして表示させたいmenu要素のid属性の値を指定。
dirltr,rtl,auto文字表記の方向を指定。ltr(左から右)、rtl(右から左)、auto(自動)。
draggabletrueまたはfalseドラッグの可・不可を指定。true(ドラッグ可)、false(ドラッグ不可)。
dropzonecopy,move,linkドロップするとどうなるかを指定。copy(コピー)、move(移動)、link(リンク)など。
hiddenなし非表示にする。この属性は属性名だけで指定する。
id固有の名前ドキュメント内の1つの要素を特定するためのもので、他と重複しない名前を指定。
langenやjaなど言語の種類を指定。en(英語)、ja(日本語)など。
spellchecktrueまたはfalseスペルチェックを指定。true(チェックする)、false(チェックしない)。
styleプロパティ:値;CSSソースを直接書き込むことが可能。
tabindex整数Tabキーでの移動順を指定。0以上の整数(フォーカス可)、負の値(フォーカス不可)。
title通常のテキスト一般的なパソコンのブラウザではツールチップで表示される助言的な情報を指定。
translateyesまたはno翻訳すべきかどうかを指定。yes(翻訳してよい)、no(翻訳すべきでない)。

W3C-HTML5.1 2nd Edition Global attributes
W3C-Global Attributes