2021. 4. 23. 14:32ㆍHTML/Basic
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
위에서부터 하나하나 설명 드리겠습니다
<!DOCTYPE html>
DOCTYPE 문서의 형식을 정의하기 위해서 삽입 해준다고해요
나중에 코딩을 다 하면 유효성 검사를 해야하는데 그때 필요 하다 정도로 알고 가시면 될거같습니다
<html lang="ko">
html 문서의 시작부분이자 웹페이지가 로딩 되었을때 초기 언어를 설정하는 부분입니다
현재 ko는 Korean이고 영어로 설정하고 싶다면 English의 약자 en을 써주시면 됩니다
<head>
말 그대로 html의 머리부분입니다
meta 태그를 이용해서 문서가 어떤 언어를 사용할지 뷰포트 사이즈는 몇으로 할지를 정하고,
CSS를 불러와서 html문서를 꾸며주는 역할을 할수있게 해줍니다
실질적으로 웹 페이지에 보여지지는 않습니다
사람이 생각하는게 실제화할수 없는것과 같은 맥락이라고 생각합니다
그러니 head부분은 무엇인가를 실행하기 위해서 생각하는 부분이라고 이해하시면 될거같습니다
<meta charset="UTF-8">
유니코드를 설정할수 있는 태그입니다
4bit 8bit 16bit 로 설정이 가능하며 4bit는 사용성이 많이 떨어지기 때문에 사용을 안합니다
8bit 와 16bit는 상황에 맞게 설정을 하면 된다고 하지만 대부분 8bit를 사용하니 UTF-8을 사용하면 될거같습니다
<meta http-equiv="X-UA-Compatible" content="IE=edge">
브라우저 호환성 관련 태그입니다
오래된 브라우저에서는 정상적으로 호출이 되지 않을수 있기 때문에 각 브라우저 마다 정상적 으로 호출이 되게 하기 위한 태그입니다
Chrome=1, IE=9, IE=8, IE=7 로 표기할수 있으며 IE=edge가 앞서 말한 7,8,9를 모두 의미하는 속성입니다
<meta name="viewport" content="width=device-width, initial-scale=1.0">
초기 웹페이지 로딩시에 화면 보여지는 뷰포트 사이즈 관련 태그입니다
content의 width=device-width 즉 초기 뷰포트의 가로값은 사용자의 디바이스의 가로값과 같다
그 뷰포트 안에 보여지는 크기는 1.0 즉 100%이다 라고 해석할수 있습니다
<title>Document</title>
우리가 웹페이지를 열면 이 사이트가 어디인지 알수 있는 방법은 사이트의 주소를 보고 알수도있지만 더 간단하게 알수 있는 방법은 웹 상단의 텍스트,아이콘 일것입니다
title은 웹 페이지의 상단바의 들어갈 이름을 정해주는 태그입니다
<body>
body도 위 head와 같은 맥락으로 단어 그대로 몸통부분입니다
body는 웹 페이지 내에 보여지는 부분을 작성하게 되며 실제 어떤식으로 행동 하는지를 담당하는 부분입니다
이 부분은 설명할게 조금 많기 때문에 #2장에서 이어서 설명을 하도록 하겠습니다
'HTML > Basic' 카테고리의 다른 글
| [초급] 초급 #3 (0) | 2021.05.24 |
|---|---|
| [HTML] 초급 #2 (0) | 2021.04.26 |
| [HTML]div,span(code) (0) | 2021.04.22 |