CSS の ID セレクター (ID selector) は、 id
属性の値に基づいて要素とマッチします。選択される要素の ID
属性は、セレクターで指定した値と完全一致していなければなりません。
/* The element with id="demo" */ #demo { border: red 2px solid; }
構文
#ID値 { スタイルプロパティ }
なお、これは以下の属性セレクター
と等価です。
[id=ID値] { スタイルプロパティ }
例
CSS
#identified { background-color: skyblue; }
HTML
<div id="identified">これは特別な ID がついています!</div> <div>これは単なる普通の div です。</div>
結果
仕様書
仕様 | 状態 | コメント |
---|---|---|
Selectors Level 4 ID selectors の定義 |
草案 | 変更なし |
Selectors Level 3 ID selectors の定義 |
勧告 | |
CSS Level 2 (Revision 1) ID selectors の定義 |
勧告 | |
CSS Level 1 ID selectors の定義 |
勧告 | 初回定義 |
ブラウザー実装状況
このページの互換性一覧表は構造化データから生成されています。このデータにコントリビュートしたい場合は、 https://github.com/mdn/browser-compat-data を確認してプルリクエストを送ってください。
Update compatibility data on GitHub
デスクトップ | モバイル | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
ID selector (#idName ) | Chrome 完全対応 1 | Edge 完全対応 12 | Firefox 完全対応 1 | IE 完全対応 3 | Opera 完全対応 あり | Safari 完全対応 1 | WebView Android 完全対応 ≤37 | Chrome Android 完全対応 18 | Firefox Android 完全対応 4 | Opera Android 完全対応 あり | Safari iOS 完全対応 1 | Samsung Internet Android 完全対応 1.0 |
凡例
- 完全対応
- 完全対応