CSSの優先順位

CSSの各セレクタには以下のような点数が存在し、点数の高いものが優先されます。
また、同点数の場合は、後に書かれたもの（下に書かれたもの）が優先されます。

全称セレクタ（*）
→ 0点
タイプセレクタ（p、h1 など）
→ 1点
疑似要素（::before など）
→ 1点
擬似クラス（:hover など）
→ 10点
classセレクタ（例 .menu）
→ 10点
idセレクタ（例 #footer）
→ 100点
htmlに直書き（例 style="color:#333"）
→ 1000点
!important宣言（例 .sub{margin:0 !important;} ）
→ 最優先

具体的には、

.list ＝ 10点
p.list
→（1＋10）＝ 11点
.list p
→（10＋1）＝ 11点
div.list span
→（1＋10＋1）＝ 12点
.list li a
→（10＋1＋1）＝ 12点
#list .menu
→（100＋10）＝ 110点
ul#list li.menu a
→（1＋100＋1＋10＋1）＝ 113点
のように優先順位が決定づけられます。