[HTML] 기본 구조

모든 HTML 문서가 가지는 기본적인 표준화된 구조는 다음과 같다.

<!DOCTYPE html>
<html>
<head>
    <title>왕초보</title>
</head>
<body>

</body>
</html>

<!DOCTYPE html>

문서(document)의 타입(type)을 명시하는 선언문이다.

DOCTYPE은 HTML 문서에서 최상단에 위치하여 가장 먼저 선언되어야 된다.

HTML의 최신 규격, HTML5 버전을 사용하고 있음을 브라우저에 알리는 것이다.

브라우저가 표준 방식으로 처리하게 해주고 버전에 따라 호환되는 태그도 다르기 때문에 반드시 선언해준다.

(만약 안하면 내가 생각한 것과 다르게 브라우저가 자기 멋대로 해석할 수도 있다.)

<html>
</html>

HTML 문서의 최상위 요소이다.

하나의 <head> 태그와 <head> 태그에 따라오는 하나의 <body> 태그를 가진다.

다른 모든 요소의 바탕이 되는 뿌리 요소(root element)이다.

<head>
</head>

데이터를 설명하는 데이터인 메타데이터(metadate) 요소이다.

<head> 태그에서 정의된 메타데이터는 브라우저나 다른 웹에서 사용하게 된다.

페이지 상에 보이지 않는 내용을 담고 있고 CSS의 스타일 속성도 입력할 수 있다.

<title>왕초보</title>

문서의 제목이다.

문서 상에서 나타나는 것이 아니라 브라우저 탭 상에 표시되는 제목이다.

<body>
</body>

문서의 모든 내용을 담고 있다.

웹 페이지에서 눈으로 확인할 수 있는 모든 내용이다.

VSCode에서는 HTML의 기본 형태에 대한 자동완성 기능을 제공해준다.

VSCode에서 HTML 파일을 편집할 때에 " ! >> Tab "을 누르면 다음과 같이 나온다.

[HTML] <button>이 <form> 안에 있는 경우 (1)	2023.11.15
[HTML] 요소 사이의 공백과 해결법 (1)	2023.11.06
[HTML] 특수문자 엔티티(Entity)와 예약어(Reserved Word) (0)	2023.11.01
[HTML] HTML5와 <!DOCTYPE> 선언의 이유 (15)	2023.10.31
[HTML] 파일 열기 (0)	2023.10.30

왕초보 개발자의 필기 노트