네이버 HTML로 알아보는 기본 구조, 틀, 뼈대
- 웹 언어 배우기/HTML
- 2018. 10. 20. 11:00
네이버 HTML의 기본 구조, 틀, 뼈대
이 글을 보고 계시는 분들이시라면 HTML에 관심이 있어서 방문하셨을 것입니다. HTML은 앞서 설명한 대로 홈페이지를 만들 때 뼈대 역할을 합니다.
본격적으로 HTML의 기본 구조 틀을 알아보기 전에 네이버의 HTML은 어떻게 만들어졌는지 알아보겠습니다. 여러분들도 한번 해보면 도움이 됩니다. 전혀 어렵지 않습니다!
대부분의 웹 개발자들은 크롬의 개발자 도구를 사용하고 있습니다. 기능이 많고 알아보기 쉽게 때문에 앞으로 실습할 때에는 크롬을 이용하고자 합니다.
크롬으로 네이버에 접속하고 F12 또는 「Ctrl + Shift + I」를 누르면 위 사진과 같이 개발자 도구가 나옵니다.
<!DOCTYPE html>
<html>
<head>
문서를 정의하는 위치
</head>
<body>
문서에 표시되는 컨텐츠
</body>
</html>
위 코드가 바로 html의 기본 구조이자 틀이자 뼈대 입니다. 생각보다 간단하죠? 지금부터 하나씩 파헤쳐 보도록 하겠습니다.
HTML의 기본 구조 상세 설명
HTML 첫번째로 올라왔던 글에 있는 <a> 태그도 그렇고 지금 위에 보이는 HTML의 기본 구조도 그렇고 <>(열린 태그), </>(닫힌 태그)가 참 많이 있습니다. 이것은 태그의 형식으로 무조건 있어야 합니다.
<!DOCTYPE html>
이것은 태그가 아닌 선언하는 것으로 HTML5의 형식대로 작성했다는 것을 의미합니다. 선언을 추가하면 브라우저가 문서의 유형을 알 수 있습니다.
<html> 태그는 시작과 끝을 의미합니다. 그 사이에는 <head> 태그와 <body> 태그로 구성됩니다.
<head> 태그는 페이지의 이름이나 문서의 타이틀 등을 지정합니다. 또한 html 문서 이외에 다른 곳에 있는 코드 혹은 파일을 불러올 때 쓸 수 있습니다. 대표적으로 <meta>, <title> 태그가 있습니다.
<body> 태그는 웹 브라우저를 통해 보이는 내용이 들어갑니다.
