DOCTYPE 또는 문서 형식 선언(Document Type Declaration)은 어떤 SGML이나 XML 기반 문서 내에 그 문서가 특정 문서 형식 정의(DTD)를 따름을 지정하는 것이다. 문서의 첫번째 줄에 위치해야 한다.
DTD(Documnet Type Definition) - SGML 계열의 마크업 언어에서 문서가 어떻게 구성되어야 하는지 정의하는 것이다. SGML을 비롯해 HTML, XHTML, XML 등에서 쓰인다.
HTML 문서에 문서 형식 선언이 없는 경우에는 비표준 모드(Quirks mode)로 렌더링되고, 문서 형식 선언이 있는 경우에는 표준 모드로 렌더링된다. 표준 모드로 렌더링되는 경우 웹 페이지가 모든 웹 브라우저에서 같은 레이아웃으로 제공되도록 할 수 있다.
<!DOCTYPE html>
<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html>
<html>
<head>문서의 정보</head>
<body>문서의 내용</body>
</html>
html
태그html 파일의 범위를 지정, head
와 body
를 포함한다.
head
태그meta
title, link, style, script 태그에서 나타낼 수 없는 정보들을 표시하기 위한 태그
속성 | 의미 | 값 |
---|---|---|
charset | 문자 인코딩 방식 | UTF-8 등 |
name | 검색 엔진에 제공하기 위한 정보의 종류 | author, description, viewports 등 |
content | name이나 http-equiv 속성의 값을 제공 |
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" >
title
웹 페이지의 제목을 나타내기 위한 태그
link
외부 문서(HTML, CSS, icon)를 연결할 때 사용하는 태그
<link href="main.css" rel="stylesheet">
<link rel="icon" href="favicon.ico">
속성 | 의미 | 값 |
---|---|---|
rel | 현재 문서와 연결한 아이템의 관계가 어떻게 되는지 설명(필수) | stylesheet, icon 등 |
href | 외부 문서의 위치를 지정 | 경로 |
style
HTML 문서 내부에 CSS 코드를 작성할 경우 사용하는 태그
script
JavaScript 파일을 불러오거나 코드를 작성할 경우 사용하는 태그
body
태그div
아무런 의미가 없는 태그
image
이미지를 넣을 때 사용하는 태그
<img src="/img/pic.png" alt="그림">
속성 | 의미 | 값 |
---|---|---|
src | 이미지의 URL(필수) | URL |
alt | 이미지의 대체 텍스트(alternate)를 지정(필수) |
/* / 없음 */
<img>
/* / 있음 */
<img/>
HTML5에서는 두가지 모두 허용되지만 XHTML에서는 /를 붙여줘야 한다.