--- title: 상속 slug: Web/CSS/inheritance tags: - CSS - Guide - Inheritance - Layout - Web translation_of: Web/CSS/inheritance ---
MDN 내 각 CSS 속성(property) 정의 페이지의 요약절은 그 속성이 기본(default)으로 상속되는지("Inherited: Yes") 혹은 상속되지 않는지("Inherited: no") 쓰여 있습니다. 이 상속 여부는 요소의 속성에 어떤 값이 지정되지 않을 때 일어나는 일을 제어합니다.
요소의 상속되는 속성에 값이 지정되지 않은 경우, 요소는 부모 요소의 해당 속성의 계산값을 얻습니다. 오직 문서의 루트 요소만 속성의 요약절에 주어진 초기값을 얻습니다.
상속되는 속성의 대표적인 예는 {{ Cssxref("color") }} 속성입니다. 주어진 스타일 규칙:
p { color: green }
과 마크업:
<p>This paragraph has <em>emphasized text</em> in it.</p>
em
요소는 p
요소로부터 {{ Cssxref("color") }} 속성값을 상속했기 때문에, "emphasized text"는 녹색으로 보입니다. 속성의 초기값(페이지가 어떤 색을 지정하지 않았을 때 루트 요소에 사용된 색)을 얻지 않습니다.
요소의 상속되지 않는 속성(Mozilla 코드에서는 가끔 reset 속성으로 불림)에 어떤 값이 지정되지 않는 경우, 요소는 그 속성의 초기값을 얻습니다(속성의 요약절에 지정된 대로).
상속되지 않는 속성의 대표적인 예는 {{ Cssxref("border") }} 속성입니다. 주어진 스타일 규칙:
p { border: medium solid }
과 마크업:
<p>This paragraph has <em>emphasized text</em> in it.</p>
"emphasized text"는 테두리가 없습니다({{ Cssxref("border-style") }}의 초기값이 none
이기 때문에).
{{ Cssxref("inherit") }} 키워드는 작성자가 명시적으로 상속을 지정할 수 있게 합니다. 상속되는 속성과 상속되지 않는 속성 모두에 작동합니다.