본문 바로가기
front-end/css

CSS 상속

by Dreaming Coder 2020. 12. 30. 12:32

 


이 포스팅은 PC로 작성되었습니다.

모바일로 보시는 분들에게는 가끔

줄 바꿈이 어색하게 보일 수 있습니다.

 


 

 

 

지난 포스트

 

CSS 웹폰트 사용하는 법

이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게는 가끔 줄 바꿈이 어색하게 보일 수 있습니다. 지난 포스트 CSS 폰트의 글꼴, 굵기, 줄 간격 설정 이 포스팅은 PC로 작성되었습니다.

gogogameboy.tistory.com

 

 

 

 

 

 

 

이번에는 CSS의 상속에 대한 내용을 공부해보겠습니다.

위의 생활코딩 강의 내용과 같이 웹페이지의 모든 폰트를 같은 색상으로 변경을 하고 싶을 때는, CSS에서 일일이 모든 태그들에 컬러 속성을 넣어줄 것이 아니라, 그 모든 태그를 감싸고 있는 상위 태그에만 속성 값을 넣어주면 됩니다.

 

하지만 모든 CSS 효과가 이렇게 상속이 되는 것은 아닙니다. 상속이 적용 안되는 것이 더 나은 속성들은 상속하지 않습니다.

 

 

상속하는 속성과 상속하지 않는 속성

 

 

Full property table

 

www.w3.org

생활코딩 강의에 나오는 위의 사이트에서 확인하실 수 있습니다.

 

 

 

위의 소스 코드는 PC에서 드래그 후,
ctrl+x로 잘라내서 다른 곳으로 붙여넣기가 가능합니다.
ctrl+c(복사)는 불가능합니다.

 

 

 

소스 코드를 적으며 직접 해볼 필요까지는 없는 보기만 해도 충분한 내용이라고 생각하지만, 소스 코드는 일단 적어두겠습니다.

 

 

 

 

 

 

다음 포스트

 

CSS 구글 크롬 테마 변경하기

이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게는 가끔 줄 바꿈이 어색하게 보일 수 있습니다. 지난 포스트 CSS 상속 이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게

gogogameboy.tistory.com

 

 

 


이 글이 도움이 됐다면 하단의 공감 버튼을 꾹 눌러서
빨간 하트로 만들어주세요.

(비로그인도 가능합니다!!)
지인에게 보여주고 싶은 글이었다면
공감 버튼 옆을 클릭해서 SNS 공유해주세요.
댓글은 블로그 운영에 큰 힘이 됩니다.

 


 

'front-end > css' 카테고리의 다른 글

CSS 박스 사이징  (0) 2021.01.01
CSS 박스 모델 (padding, margin)  (0) 2021.01.01
CSS, inline과 block  (0) 2020.12.31
CSS 선택자 우선 순위 (캐스케이딩)  (0) 2020.12.31
CSS 구글 크롬 테마 변경하기  (0) 2020.12.30

댓글