[css] 우선 적용되는 순서 (우선 순위)

 

1. 속성값 뒤에 !important가 붙어있는 속성
2. html 파일에서 스타일을 직접 지정한 속성(<p style="")
3. 선택자에 id(#id)가 쓰인 속성
4. class(.class), attribute(input[type="text"] 등), pseudo-class(:hover, :active 등)로 지정한 속성
5. 태그 이름으로 지정한 속성
6. 부모 요소에 의해 상속된 속성

 

같은 우선 순위에 있는 경우, 설정된 css 개수가 많은 경우가 우선되고,

모든 설정이 같은 경우 나중에 선언한 것이 우선되어 적용된다.

 

 

.happy{
	color: pink!important;
}

 

우선 순위를 무시하고 적용시키고 싶은 속성이 있다면, !important를 사용하면 된다.

!important는 우선 순위뿐만 아니라 개발자와 디자이너간의 커뮤니케이션시 중요한 속성임을 나타내는 표시가 되기도 한다.

 

하지만 important는 스타일시트 자연의 흐름을 방해하는 것이기 때문에 웬만하면 쓰지 않는 것이 좋다.