HTMLのclassとidの使い方

• idは(親)タグにつける場所名
• classはデザインを管理するためのデザイン名

セレクタの詳細度 (優先順位)

セレクタ	点数	内容
idセレクタ	1.0.0	#OO
クラスセレクタ style属性 疑似要素	0.1.0	.OO <タグ style="OO:OO;"> :hover, :visitedなど
タグセレクタ 疑似要素	0.0.1	<p>や<a>など ::before,::afterなど

style属性が1番優先度が高い。
CSSのどこに書くかでタグの優先度が変わる

2番目がHTMLタグの中にあるタグ
3番目がCSSファイルの中にあるもの

---

CSSのセレクタの優先順位と点数

• a:link{ color:blue; } タグセレクタ+疑似クラス +11
• nav_a{ color:green; } タグセレクタ+タグセレクタ +2
• a{ color:red; } タグセレクタ +1

疑似クラス
div > article:first-of-type

• 基本的には ...of-type を使用する。
• 子要素やリストには :first-Child を使用する。

タグ名:first-of-type 最初の子要素
(子要素) :last-of-type 最後の子要素
　　　　 :nth-of-type(2) 2番目の要素