css. CSS 적용 우선순위

1. 뒤에 나오는 CSS가 우선순위가 높다.

2. 우선순위가 같다면 개수가 많은 것이 먼저 실행.
(부모-자식 관계가 많은 경우)

 

 

< 우선순위 >

 

 

!important

∨

inline style attribute

∨

id

∨

class, 다른 속성(attribute), 가상클래스(:)

∨

tag element, 가상요소(::)

 

 

 

 

---

 

!important

 

우선순위를 무시하고 꼭 적용시킬 속성은

속성 값(value) 뒤에 !important 키워드를 붙인다.

 

.content{ color: black !important }

 

- 우선순위 뿐만 아니라 디자이너와 개발자간 소통시 '중요한 속성임'을 나타냄.

 

 

 

 

+) !important와 inline style attribute는 보통은 사용을 제한한다.

 

---

ref.

 

CSS 적용 우선순위 - ofcourse

(CSS) CSS 적용 우선순위 - CSS간 충돌 해결 방법