상속
말 그대로 스타일이 상속되어 자식에게도 같은 스타일이 적용된다는 의미
body {
color: red;
font-size: 14px;
}
body라는 태그에 color는 빨간색으로, 크기는 14px로 스타일함
그런데 p태그는 아무 스타일도 갖고 있지 않는데, 부모인 body태그에 영향을 받아서 빨간색과 14px로 변경됨
blockquote 태그 또한 14px이 적용.
blockquote {
color: black;
}
부모에게 color: red;라는 속성이 있더라도
본인의 요소가 해당 속성을 갖고 있다면 본인의 스타일이 적용
.javascript {
color: blue;
font-weight: bold;
}
javascript 클래스의 부모(blockquote)는 color: black;를, 하나 더 위의 부모(body)는 color: red;속성을 가졌지만, 본인도 color 속성을 갖고 있으므로 파란색
그룹 ( Group )
이 태그에, 저 태그, 이 클래스에.. 같은 스타일을 적용하고 싶음. 그럴 때 각자의 selector에 모두 똑같은 스타일을 적기보다는, 다음과 같이 한꺼번에 스타일을 지정할 수 있음
.what-is-blockquote, span {
color: green;
}