HTML-L3-011 / 접근 가능한 폼
오류 요약 앵커
중급문제
오류 요약 section의 제목 id=errors-title, aria-labelledby 연결과 #email로 이동하는 오류 링크를 작성하세요. 입력에는 aria-invalid=true와 설명 id=email-error를 연결하세요.
예시 텍스트·ID·참조 관계를 유지하면서 의미에 맞는 HTML을 작성하세요.
확인할 조건
- 요약 이름
- 오류 이동
- 오류 상태
- 필드 설명
- 설명 대상
힌트
오류 요약의 이동 대상과 필드 설명을 따로 연결하세요.
해설·정답 보기
한 번에 오류 위치를 찾는 요약과 입력에 붙는 상세 오류를 함께 제공합니다.
<!doctype html> <html lang="ko"> <head><meta charset="utf-8"><title>실습</title></head> <body> <main><section aria-labelledby="errors-title"><h2 id="errors-title">입력 확인</h2><a href="#email">이메일을 입력하세요</a></section><label for="email">이메일</label><input id="email" aria-invalid="true" aria-describedby="email-error"><p id="email-error">이메일을 입력하세요</p></main> </body> </html>
index.html화면·구조 확인
코드는 이 브라우저에 자동 저장돼요.
풀이 결과
코드를 작성하고 채점하기를 눌러보세요.
학습용으로 제공된 조건을 확인해요. 알고리즘 사용 방식·설계 의도는 해설과 함께 비교해보세요.