[CSS] 상속과 우선순위

조상요소에 스타일을 지정하면 하위요소에도 적용된다.

 

상속 되는 속성들(properties)

• font

  • font-size

  • fonet-weight

  • font-style

  • line-height

  • font-family

• color

• text=align

• text-indent

• text-decoration

• letter-spacing

• opacity

 

강제 상속 : inherit 값 사용하여 부모→자식으로 강제 상속(후손 적용X)

*모든 속성이 강제 상속을 사용할 수 있는 건 아님

.class {
	position: inherit; /*강제 상속*/
}

 

우선순위 결정

 

같은 요소가 여러 선언의 대상이 될 경우, 어떤 선언의 CSS속성(property)을 우선 적용할지의 순위

 

 

1. 명시도 점수 큰 순서

 

인라인(HTML style 속성 사용) : 1000점 *점수가 쓸데없이 높아서 유지보수 하기 힘듬. 그래서 사용X 추천)

아이디 선택자: 100점

클래스 선택자: 10점 ( not 은 점수 계산 X)

태그 선택자 : 1점

전체 선택자 : 0점

상속 : 계산하지 않음. 항상 우선하지 않음

 

2. 선언순서(명시도 같을 경우)

 

3. 중요도(명시도>상속)

 

4. !important 가 적용된선언 방식이 제일 우선