- Orders
- Same Selector, different input -> The last one wins.
- html 파일 내 중복된 CSS 링크 -> 마지막 파일이 덮어씌워짐.
- Specificity: 명시도, 우선순위 계산
- The more specific selector wins.
- Specificity Calculator: 계산해주는 사이트
(It's still not a normal decimal number system.)
- Chrome Devtools: 충돌 시 매우 유용
-
Inline Styles
HTML 내에서 하는 스타일링.
모든 CSS Selector보다 선행하기 때문에 안쓰는 것이 좋다.
-
!important
Superior specificity. 마찬가지로 안쓰는 것이 좋지만 다른 라이브러리를 사용할 때 유용할 수도 있다.
-
Inheritance
button, input { color: inherit; }모든 셀렉터가 상위 셀렉터에 의해 자동적으로 디폴트값이 설정되는 것은 아님.
만약 그것들 또한 디폴트 값으로 설정해주고 싶다면 위와 같이 inherit 키워드를 입력하면 된다.
