CSS - 9. 상속, 그룹

1. 상속(Inheritance)

상속은 css가 가진 특성이다. 말 그대로 스타일이 상속되어 자식에게도 같은 스타일이 적용된다는 의미이다.

body {
  color: red;
  font-size: 14px;
}

body라는 태그에 color는 빨간색으로, 크기는 14px로 스타일했을 때, body 안에 있는 태그들은 부모인 body태그에 영향을 받아 빨간색과 14px로 변경된다. 만약 부모 요소가 빨간색이고 본인(자식) 요소가 파란색으로 속성을 지정해줬다면, 부모 요소의 속성보다 본인의 스타일이 우선 적용된다.

 

---

2. 그룹(Grouping)

여러 태그에 한 스타일을 적용하고 싶다면 각각 코드에 적어주는 것보다 가독성을 위해 한번에 그룹으로 묶어 적용하는 것이 좋다.

p, span, div, my-class {
  color: green;
}