우선순위 결정

<div id="a" class="b">
    text....
</div>

#a{
 color : red;
}

.b{
 color : blue;
}

div{
 color : green;
}

위 코드에서 id, class 엘리먼트 순으로 우선순위를 가진다.

id는 클래스보다 우선되고 클래스는 엘리먼트보다 우선된다.

따라서 위 코드에서는 id인 a의 ㅣ색상이 적용되게 된다.

선언방식에 따른 차이

같은 선택자(selector)라면 나중에 선언한 것이 반영된다.

선택자의 표현이 구체적인 것이 있다면 먼저 적용된다.

body > span (O)

span (x)

결론

ID > CLASS > ELEMENT 순으로 반영

참고링크: https://www.edwith.org/boostcourse-web/lecture/16674/ (부스트코스)