【CSSセレクタ】E#idName

style.css

/* id名のみで指定 */
#hoge { color: red;}

/* タグ + id名で指定 */
p#hoge1 { color: blue;}

/* ページの主要エリアにidを使う実践例 */
#header { background-color: #2c3e50; color: white; padding: 16px;}
#main { max-width: 1200px; margin: 0 auto; padding: 24px;}
#footer { background-color: #34495e; color: #ecf0f1; padding: 24px; text-align: center;}

/* id はページ内リンクのアンカーとしても使用される */
#section-top { scroll-margin-top: 60px;} /* スティッキーヘッダーがある場合の調整 */

#hoge { color: red;} /* id名『hoge』を持つ要素に適用されます。 */
p#hoge1 { color: blue;} /* id名『hoge1』を持つp要素に適用されます。 */

<div id="hoge">ここはdiv要素です。id名に『hoge』と指定しています。</div>
<div>ここはdiv要素です。</div>
<p id="hoge1">ここはp要素です。id名に『hoge1』と指定しています。</p>
<p>ここはp要素です。</p>

デスクトップ

Chrome

1 以降 ○

Firefox

1 以降 ○

Safari

1 以降 ○

Edge

12 以降 ○

IE

11 ○

10 ○

9 ○

8 ○

7 ○

6 ○

Opera

3.5 以降 ○

2 以前 ×

モバイル

iOS Safari

1 以降 ○

Android Browser

4.4 以降 ○

3 以前 ×

Chrome Android

最新版 ○

デスクトップ版と同等の対応です

Firefox Android

最新版 ○

デスクトップ版と同等の対応です

※ バージョン情報は MDN に基づいています。