부모 속성을 상속하는 CSS 태그 모음

 

자식 태그에 특별한 속성이 지정되어 있지 않으면 자동으로 부모 속성을 물려받아 스타일링되는 태그들이 있다.

 

color 

font-family

font-size

font-weight

line-height

list-style

text-align

text-indent

text-decoration

letter-spacing

opacity

visibility

 

보통 글자, 정렬과 관련된 css 태그들이 그대로 상속되는 듯 하다. 그리고 예외적으로 <a> 태그에는 color 속성이 상속되지 않는데, 상속되지 않는 속성을 강제로 상속시킬 때는 해당 css에 inherit 라는 속성값을 사용하면 된다. 

더해서, 자식의 자식 요소에는 스타일링이 적용되지 않는다는 것도 알아두자.

 

<div class="go_google">
  구글 사이트로 이동하고 싶다면 <a href="https://google.com">여기</a>를 클릭하세요!
</div>

<style>
  .go_google {color: blue;}
  .go_google a {color: inherit;}
</style>