콘텐츠 모델
- Metadata
- 콘텐츠의 스타일, 동작을 설정하거나 다른 문서와의 관계 등 정보를 포함하는 요소 포함
- 대부분 <head>에 들어감
- "base, link, meta, noscript, style, title"
- Flow
- 문서의 자연스러운 흐름에 의해 배치되는 요소 포함
- Metadata의 일부 태그들만 제외하고 대부분Flow 에 포함
- "a, br, div, dl, em, h1~h6, img, input, ol, p, ul, span"
- Sectioning
- 문서의 구조와 관련된 요소 포함
- "article, aside, nav, section"
- Heading
- 각 section에 정의하는 heading 태그 포함
- "h1, h2, h3, h4, h5, h6"
- Phrasing
- 문서의 텍스트 또는 텍스트를 꾸며주는 문단 내부 레벨로 사용되는 요소 포함
- "a, br, del, em, img, input, map, math, q, script, span, time, var, video"
- Embedded
- 외부 콘텐츠를 표현하는 요소들이 포함되며 오디오나 비디오, 이미지 등 멀티미디어 관련 요소
- "audio, canvas, embed, img, math, video"
- Interactive
- 사용자와 상호작용을 하는 요소
- "a, audio, button, embed, img, input, label, menu, select, video"
시멘틱 마크업
- 기계(컴퓨터, 브라우저)가 잘 이해할 수 있도록 구조를 짜는 것
- 의미에 맞는 태그, 요소를 사용하고 정해진 약속대로 코드를 작성해야 함
블록&인라인
- 블록 레벨 요소
- 부모 요소의 가로 영역에 맞게 채워져 표현되는 요소
- 양옆으로 다른 요소가 배치되지 않게 박스를 생성
- 일반적으로 모든 요소를 포함할 수 있음
- 인라인 레벨 요소
- 하나의 라인 안에서 자신의 내용만큼의 박스를 만드는 요소
- 요소 앞 뒤로도 다른 인라인 요소들이 자리할 수 있음
- 블록 레벨 요소의 자식으로 분류되므로 자손으로 블록 레벨 요소를 가질 수 없음
- 다만, <a>는 인라인 레벨 요소지만 자손으로 블록 레벨 요소를 가질 수 있음(예외)
유지경성