들어가기 앞서,
- CSS 기본 문법2에 이어 기본적인 문법 스타일 상속에 대해서 다루어보겠다.
상속
위 그림을 보면 .animal에 대해서만 css를 작성해주었지만 animal class의 하위 클래스인 tiger, lion, elephant class에도 css style이 적용된 것을 확인할 수 있다. 이를 상속이라고 한다.
모든 css 속성들이 상속 되는건 아니고 글자/문자와 관련된 속성들만 상속된다.(모든 글자/문자 속성이 상속되는 것은 아님)
ex)
- font-style: 글자 기울기
- font-weight: 글자두께
- font-size: 글자 크기
- line-height: 줄 높이
- font-family: 폰트(서체)
- color: 글자 색상
- text-align: 정렬
강제 상속
상속은 위에서 설명했듯이 글자/문자와 관련된 속성들만 상속이된다. 하지만 필요에 의해 다른 속성들도 상속해야하는 경우 "inherit"을 사용하면 글자/문자와 관련된 속성이 아니더라고 강제로 상속이 가능해 진다.
'Front-end' 카테고리의 다른 글
| css 속성1 (0) | 2022.01.24 |
|---|---|
| css 기본 문법4(선택자 우선순위) (0) | 2022.01.15 |
| css 기본 문법2(여러가지 선택자) (0) | 2022.01.15 |
| css 기본 문법1(선택자, 속성, 값, 주석, 선언 방식) (0) | 2022.01.15 |
| HTML 기본 문법 (0) | 2022.01.10 |
