CSS에서 선택자 그룹화
때로는 다음과 같은 상황이 발생할 수 있습니다:
다른 태그들에 대해 같은 작업을 해야 합니다.
예를 들어, 모든 제목 h2, h3 및 단락을
빨간색으로 만들고 싶습니다.
이 경우 다음과 같은 코드를 작성해야 할 것입니다:
h2 {
color: red;
}
h3 {
color: red;
}
p {
color: red;
}
그러나, 이를 조금 더 짧게 만드는 방법이 존재합니다: 태그 선택자는 쉼표를 통해 결합할 수 있으며, CSS 코드가 그들 모두에게 동시에 적용됩니다. 위의 코드는 다음과 같이 더 짧게 다시 작성할 수 있습니다:
h2, h3, p {
color: red;
}
선택자 그룹화를 사용하여 코드를 단순화하세요:
h1 {
text-align: center;
}
h2 {
text-align: center;
}
h3 {
text-align: center;
}