CSS3 규칙

CSS3 스타일 시트에는 몇가지 규칙이 있습니다.

CSS3 스타일은 부모 태그로부터 상속된다

자신을 둘러싸는 태그는 부모 태그 혹은 부모 요소 (parent element) 라고 한다. 예를 들어 다음에서 <em> 태그는 <p> 태그의 자식이다.

<p style="color:blue">Hello World
  <em style="font-size:28px">I'm a child</em>
</p>

이 코드에서 <em> 태그인 I’m a child 의 글자는 28px 크기로 출력되지만, 글자 색은 부모 <p> 태그를 상속받아 파란색으로 출력된다.

스타일 합치기(cascading)와 오버라이딩(overriding)

브라우저에는 각 태그에 대한 디폴트 스타일 시트를 가지고 있어, 개발자가 만든 스타일이 없으면 이를 적용한다. 그러므로 각 태그에는 다음 4가지 종류의 스타일 시트가 동시에 적용될 수 있다.

스타일 합치기(cascading)란 앞의 4가지 스타일 시트가 태그에 동시에 적용될 때 스타일이 합쳐져서 적용됨을 말한다. 하지마 여러 스타일 시트들이 하나의 태그에 중첩되어 동일한 CSS3 프로퍼티에 서로 다른 값을 설정하는 충돌이 발생하기도 한다 스타일 오버라이딩(overriding)은 덮어쓰리고, 동일한 CSS3 프로퍼티에 서로 다른 값을 설정하는 충돌 시 우선순위가 높은 스타일을 적용하는 규칙을 말한다.

스타일 적용 우선순위는 다음과 같다: