このウェブサイトはご利用の端末での閲覧に対応していません。
This website does not support your device.

グローバル属性~“id”属性

記事May 1st,2016
July 7th,2020
要素に固有の識別子を指定する属性
この記事はHTML Living Standardに対応しています。
この記事はHTML Living Standardに対応しています。

id”属性について

id”属性は要素に固有の識別子(ID名)を指定するための属性です。ID名はスタイルシートのセレクターとして要素にスタイルを適用するのに使用したり、リンクやスクリプトなどで要素を参照先とするために使用したりすることができます。

同じ文書内の複数の要素に同じID名をつけることはできません。

指定できる値

属性値 説明
文字列 要素に指定するID名

値に空白文字を含んではいけません。

ID名は英字の大文字と小文字が区別されます。

ID名の形式についてHTMLの仕様ではホワイトスペースを含んではいけないこと以外の制約はありませんが、CSSやスクリプトなどからの参照のする場合は利用先の制約に従う必要があります。例えば、CSSのIDセレクタとして使用する場合は有効なCSS識別子でなければならず、ハイフン(“-”)とアンダーバー(“_”)以外の記号はそのまま使用できない、最初の文字が数字であってはいけないなどの決まりがあります。

サンプルコード

#veryhigh-box {
height: 300px;
background-color: rgb(215,206,202);
}
<p><a href="#sayshownagon">清少納言について</a></p>

<div id="veryhigh-box">
特に意味のない背の高いボックス
</div>

<section id="sayshownagon">
<p>清少納言は平安時代の女流歌人で“枕草子”が代表作。“清少納言”はペンネームのようなもので本当の名前は清原諾子であったと言われるが諸説ある。紫式部とライバル関係にあったといわれることが多いが、当時は面識すらなかったのではないかという見方が有力である。</p>
</section>

清少納言について

特に意味のない背の高いボックス

清少納言は平安時代の女流歌人で“枕草子”が代表作。“清少納言”はペンネームのようなもので本当の名前は清原諾子であったと言われるが諸説ある。紫式部とライバル関係にあったといわれることが多いが、当時は面識すらなかったのではないかという見方が有力である。

一番上へ
トップにもどる
シェアする
シェアする
Facebookでシェアする
ツイート
Google+でシェア
Pocket
はてなブックマーク