HTML-L4-031 / 고급 데이터 표
세 단계 헤더 매핑
고급문제
지역/과목/시험의 세 단계 헤더를 표로 구성하세요. header id=region은 "서울", id=subject는 "수학", id=term은 "기말"이며 점수 셀 90의 headers는 region subject term입니다.
예시 텍스트·ID·참조 관계를 유지하면서 의미에 맞는 HTML을 작성하세요.
확인할 조건
- 세 단계 헤더
- 전체 관계
- 점수
힌트
한 셀에 관련된 모든 헤더를 연결하세요.
해설·정답 보기
복잡한 표의 관계를 명시하는 연습입니다. 실제 데이터가 커지면 여러 단순 표로 나누는 대안도 검토합니다.
<!doctype html> <html lang="ko"> <head><meta charset="utf-8"><title>실습</title></head> <body> <main><table><caption>지역별 시험</caption><thead><tr><th id="region">서울</th></tr><tr><th id="subject">수학</th></tr><tr><th id="term">기말</th></tr></thead><tbody><tr><td headers="region subject term">90</td></tr></tbody></table></main> </body> </html>
index.html화면·구조 확인
코드는 이 브라우저에 자동 저장돼요.
풀이 결과
코드를 작성하고 채점하기를 눌러보세요.
학습용으로 제공된 조건을 확인해요. 알고리즘 사용 방식·설계 의도는 해설과 함께 비교해보세요.