CSS - 상속

CSS - 상속

상위에서 적용한 스타일은 하위에도 반영된다.

padding, border와 같이 배치와 관련된 속성은 상속받지 않는다.

cascading

css는 여러가지 스타일정보를 기반으로 최종적으로 경쟁에 의해서 적절한 스타일이 반영된다.

예를들어,

div > p

p

이 두개가 같은 노드를 가르킬 수도있음.

어떤 순서로 스타일을 반영할지는 브라우저가 결정, 그 규칙을 개발자가 정해두어야함.

선언 방식에 따른 차이

우선순위가 높은 순서대로 inline > internal > external

선언 방식이 같다면

1.

span {

color : red;

}

span{

color : blue;

}

나중것이 적용(blue)

2.

body > span {

color : red;

}

span{

color : blue;

}

selector가 더 구체적으로 표현된 것을 적용(red)

3.

text ..

#a{

color : red;

}

.b{

color : blue;

}

div id,class 가 각각 a,b로 설정되어있는 div node

이런식으로 충돌(동일한 노드를 가르킴)이 일어나면 id 값을 기준으로

(id에 class보다 높은 점수부여))

우선순위가 높은 순서대로 id > class > element

참고: css specificity

from http://nooblette.tistory.com/209 by ccl(A) rewrite - 2021-07-28 17:26:22