<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>타이틀</title>
</head>
<body>
안녕하세요
</body>
</html>
웹 표준인 HTML5의 기본적인 구조에 대해 알아보겠습니다.
위에 태그들이 html5의 기본적인 구성인데요, 인터넷에 실행시키면 아래와 같이 결과가 나옵니다.
그럼 하나하나 의미를 한번 알아보겠습니다.
<!DOCTYPE html>
모든 HTML5 문서에 써야 되는 태그입니다. DOCTYPE 선언은 html태그를 쓰기 앞서 선언되어야 합니다. html 버전이 무엇인지를 웹 브라우저에 알려주는 역할을 하는 선언문으로 대,소문자를 구분하지 않습니다.
<html lang="ko">
html 문서의 시작을 선언하는 태그
html 뒤의 lang="ko"의 의미 : lang 설정과 접속자 브라우저의 언어 설정이 다른 경우, 자동번역 인터페이스 뜨게 설정.
한국어 : ko
영어 : en
중국어 : zh
일본어 : ja
독일어 : de
프랑스어 : fe
스페인어 : es
러시아어 : ru
<head>
head는 웹페이지에 보이는 영역은 아니지만, 해당 웹문서에 스타일 시트나, 자바스크립트 등 필요한 기능을 담습니다.
↓ head 태그 내부에 넣을 수 있는 태그
태그 | 설명 |
meta | 웹 페이지에 추가 정보 전달 |
title | 웹 페이지의 제목 지정 |
script | 웹 페이지에 스크립트 추가 |
link | 웹 페이지에 다른 파일 추가 |
style | 웹 페이지에 스타일 시트 추가 |
base | 웹 페이지의 기본 경로 지정 |
<meta charset="UTF-8">
유니코드 인코딩 방식 중에 하나로, 몇 가지 있긴 하지만 보통 UTF-8을 사용합니다. 만약 이걸 작성하지 않는다면 글자가 깨져 보일 수 있고, 요구하는 인코딩 방식과 달라도 글자가 깨질 수 있습니다.
<title>타이틀</title>
<title> </title> 사이에 웹페이지 제목을 쓰는 곳입니다.
위에 빨간 표시처럼 인터넷 웹페이지 제목이 표시됩니다.
</head>
head 태그가 끝났음을 선언하는 태그입니다.
<body> 안녕하세요 </body>
body 태그는 웹페이지에 보이는 모든 영역을 담당합니다. '안녕하세요'라는 글자를 입력했기 때문에 웹페이지 상에 '안녕하세요' 글자가 보입니다.
/body를 선언함으로써 dody 태그가 끝났음을 알립니다.
</html>
html 태그가 끝났음을 선언합니다.
'HTML5&웹디자인' 카테고리의 다른 글
[HTML5] 간단한 상단메뉴 만드는 방법 (0) | 2021.10.27 |
---|---|
[HTML5]html lang ="ko" 작성하는 이유 (0) | 2021.10.24 |
margin(마진)과 padding(패딩)의 차이점 (0) | 2021.10.18 |
[CSS] 웹폰트 사용법 (0) | 2021.10.12 |
HTML5 기초-시맨틱 태그 사용하는 이유 & 종류 (0) | 2021.09.26 |
댓글