class로 여러 요소를 같은 그룹으로 묶어 재사용합니다.
class 값은 CSS와 JavaScript가 여러 요소를 공통으로 선택할 때 사용합니다. 한 요소가 여러 class를 가질 수 있고 같은 class는 문서 여러 곳에서 반복할 수 있습니다.
예제에서는 <p class="notice important">내용</p> 부분부터 찾으세요. 태그 이름만 외우기보다 부모·자식 관계와 속성이 어느 요소에 붙는지를 한 덩어리로 읽으면 구조를 고치기 쉬워집니다.
먼저 현재 결과를 확인한 뒤 notice 요소를 하나 더 만들고 important class도 함께 붙여보세요. 수정 전에는 예상한 변화를 한 문장으로 적고, 실행 뒤에는 정보 순서와 키보드 접근까지 그대로인지 살펴보세요.
class 이름을 red, big처럼 현재 모양으로 지으면 디자인이 바뀔 때 의미가 어색해집니다. notice처럼 역할을 표현하세요.
직접 바꿔보세요notice 요소를 하나 더 만들고 important class도 함께 붙여보세요.