id로 문서 안에서 하나뿐인 요소를 식별합니다.
id는 한 문서에서 고유해야 하며 #id 링크의 목적지, label과 input 연결, CSS/JavaScript 선택에 사용됩니다. 반복되는 디자인에는 class가 더 적합합니다.
nav의 링크는 section의 id인 summary를 목적지로 삼아, 누르면 120px 빈 div 아래의 그 section으로 스크롤합니다. CSS에서도 같은 이름이 #summary 선택자로 쓰여 그 section에만 여백과 연한 배경을 줍니다. 하나의 id가 링크 목적지와 스타일 대상이라는 두 가지 일을 함께 하는 셈입니다.
id 선택자의 명시도는 class 선택자 열 개를 이어 붙인 것보다도 높아서, id로 준 스타일은 나중에 class로 덮어쓰기 어렵습니다. 그래서 스타일은 class로 주고 id는 링크 목적지나 label의 for 연결처럼 고유성이 필요한 곳에 남겨 두는 방식이 흔합니다. id 값에는 공백을 넣을 수 없습니다.
같은 id를 여러 요소에 붙이면 링크와 JavaScript가 어느 요소를 가리키는지 불분명해집니다.
직접 바꿔보세요새 section에 id=practice를 붙이고 이동 링크를 추가하세요.