<!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">
<!-- html 문서의 제목을 정의 -->
<title>honeyricecake</title>
<!-- 외부 문서를 가져와 연결할 때 사용 (대부분 CSS 파일) -->
<!-- rel 속성은 가져올 문서와의 관계 href 속성은 가져올 문서의 경로를 의미한다 -->
<!-- css 파일을 가져올 때는 rel="stylesheet" 를 명시 -->
<!-- 아이콘은 탭을 열었을 때 이름 옆의 로고를 의미 -->
<!-- rel="icon"으로 아이콘을 가져옴을 명시할 수 있으므로, 이미지 파일을 가져와야 한다. -->
<link rel="stylesheet" href="./main.css">
<script src="./main.js"></script>
</head>
<body>
<div>Hello World!</div>
</body>
</html><!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>honeyricecake</title>
<!-- 스타일(css)를 HTML문서 안에서 작성하는 경우에 사용 -->
<!-- 스타일을 link로 가져오거나 직접 작성하는 것을 스타일의 선언방식의 차이라 함-->
<style>
div {
color: red;
}
</style>
<!-- src는 사용할 소스 코드(파일)을 지정하는 HTML 속성 -->
<!-- script 태그는 외부의 자바스크립트 파일을 가져오는 경우 사용 -->
<!-- 또는 자바스크립트를 HTML문서안에서 작성하는 경우 사용 -->
<script src="./main.js"></script>
</head>
<body>
<div>Hello World!</div>
</body>
</html>ex.
<script>
console.log('Hello world!')
</script>script태그가 외부 파일을 가져오고 안 가져오고의 차이는 src의 유무에 따라 갈림
<!DOCTYPE html>
<html lang="ko">
<head>
<!-- meta태그는 link, style, script, title로 나타낼 수 없는 나머지 모든 정보들을 표시할 때 사용-->
<!-- 일반적으로 name= ~, content= ~ 의 방식을 취함 -->
<!-- 메타는 정보를 의미, 기본적인 정보를 메타태그로 명시 -->
<!-- 무슨 정보인지를 name 속성에 명시, 정보의 실재 값은 content에 명시 -->
<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>honeyricecake</title>
<style>
div {
color: red;
}
</style>
<script src="./main.js"></script>
</head>
<body>
<div>Hello World!</div>
</body>
</html>meta 태그에는 link, style, script, title 을 제외한 모든 정보를 표시
ex.
<meta name="viewpoint" content="width=device-width, initial-scale=1.0">viewport를 예로 들어보자. viewport는 브라우저에서 실재 내용이 표시되는 부분인데, 그 영역에 해당하는 실재값이 content에 명시된다.
우리는 스마트폰에서 웹 사이트를 오픈할 수 있는데 그 스마트폰이 여기서 말하는 모바일 장치(디바이스)이다,
그리고 그런 모바일에서 웹페이지의 가로 너비를 모바일 환경의 가로 너비와 일치시키거나 웹 사이트가 처음 출력될 때 확대/축소 여부나 정도를 어떻게 결정하겠다 등 몇가지 정보를 meta태그로 명시하는 개념이 "name=viewport"의 내용이다.
charset(Character Set 단어의 약어)은 문자 인코딩 방식을 지정하는 HTML속성이다.
문자 인코딩(Encoding)이란 문자나 기호들을 컴퓨터가 이용할 수 있는 신호로 만드는 것을 말하며, 대표적으로 한글 사용에서는 EUC-KR 혹은 UTF-8 등이 사용되며, 웹에선 UTF-8의 사용을 권장한다.
