19 개발 블로그

HTML5에서 기본적인 태그의 구조는 여는 태그와 닫는 태그로 이루어 진다.

<!DOCTYPE HTML>

<html>

<head>

</head>

<body>

예시 홈페이지 입니다.

</body>

</html>

HTML5의 그냥 별 이야기도 없는 소스를 만들어 보았다

해당 소스를 작성하고 확장자는 .html으로 저장하면 되며, 저장 시에 인코딩은 utf-8로 해주면 된다.

아래는 웹 브라우저로 해당 웹 페이지를 불러왔을 때의 사진이다.

홈페이지의 제목 란은 홈페이지 타이틀 이라는 이름으로 되어 있을 것 이다.

이제 기본 형태에 대해서 살펴 보면,

<!DOCTYPE HTML>

이 문서가 HTML5 문서라는 것을 명시한다. 예전 HTML버전 보다 확실하게 간소하다.

찾아보면 기겁한다.

<html></html> <head></head> <title></title> <body></body> 

자세한 기능은 생략하고 이런 식으로 짝이 지어 있다.

대부분의 HTML 문법은 여는 태그와 닫는 태그로 이루어져 있으며 위가 그 예시이다.

또한 여는 태그와 닫는 태그 사이에는 문자라던지, 다른 태그들이 들어온다.

<meta charset="utf-8" /> 

여는 태그와 닫는 태그가 따로 없이 그냥 태그만 있는 형식.

굳이 내용물이 들어갈 이유가 없기 때문에 한번에 열고 닫는 것이다.

각각 meta태그는 홈페이지에 정보를 설정하는 등의 목적으로 쓰이고, br 는 줄 바꿈 태그이다.

태그 옆에 한칸을 띄우고 속성을 작성한다. 속성에는 값을 대입하여 무언가를 설정한다.

여러가지의 속성을 넣을 때는 또 띄우고 속성을 연달아 작성하면 된다.

meta태그의 charset 속성은 이 문서를 어떤 문자 인코딩을 통해서 읽겠다! 라고 설정하는 것이다.

이 태그를 빼고 홈페이지를 열면 한글이 모조리 깨져서 나온다.

끝

티스토리툴바