본문 바로가기
반영훈/웹 개발

[CSS]우선순위 결정

by Banda 2020. 6. 17.

같은 요소가 여러 선언의 대상이 될 경우, 어떤 선언의 CSS 속성을 우선 적용할지 결정하는 방법

1. 명시도 점수가 높은 선언 (명시도)

2. 점수가 같은경우, 가장 마지막에 해석되는 선언 (선언 순서)

3. 명시도는 '상속' 규칙보다 우선(중요도)

4. !important가 적용 된 선언방식이 다른 모든방식보다 우선(중요도)

 

!important > 명시도 점수가 같을 때 가장 마지막에 해석되는 선언 > 명시도 점수가 가장 높은 선언 > 상속

 

스타일 속성을 통한 인라인선언(1000 Point)[비추천/ 덮어쓰기 힘듦]

ex) <div style="color: red;">HELLO WORLD</div>

ID 선택자를 통한 선언(100pt) ... #Apple

Class 선택자를 통한 선언(10pt)... .Apple

단, 가상클래스 선택자 중 :not은 점수로 치지 아니한다.

Type(태그)선택자를 통한 선언(1pt)... Apple

Universal(전체)선택자를 통한 선언(0pt)... *

상속(CSS Inheritance)을 통한 선언(점수없음, 0보다낮음)

'반영훈 > 웹 개발' 카테고리의 다른 글

[CSS]vw, vh, vmin, vmax  (0) 2020.06.20
[CSS] EM, REM  (0) 2020.06.20
[Web]HTML, CSS 속성(Attribute)과 값(value)  (0) 2020.06.13
[CSS] 가상선택자 ::before  (0) 2020.06.13
[CSS]4가지 기본 선택자  (0) 2020.06.12

댓글