<!DOCTYPE html>
<head>
<title>한효정^_^</title> <!--HTML 문서의 제목(title)을 정의-->
<link rel="stylesheet" href="./main.css" />rel : 가져올 문서와 관계(Relationship)
href : 가져올 문서의 경로(Hyper Text Reference)
./ : 주변
<link rel="icon" href="./favicon.png"> 외부 문서를 가져와 연결할 때 사용. ex) CSS 파일
Favorite Icon을 줄여서 Favicon 이라고 부름 ex) favicon.ico 혹은 favicon.png 파일이 주로 사용됨
<style>
div {
color: red;
}
</style>스타일(CSS)를 HTML 문서 안에서 작성하는 경우에 사용.
<script src="./main.js"></script>① 자바스크립트(JS) 파일 가져오는 경우. (외부에서 가져오는 link 태그의 역할, src를 통해가져옴)
<script>
console.log('Hello world!') <!--작성된 Js-->
</script>
② 자바스크립트(JS)를 HTML 문서 안에서 작성하는 경우. (내부에서 작성하는 style 태그의 역할)
<meta charset ="UTF-8" />
<meta name ="author" content ="한효정" />
<meta name ="viewport" content ="width=device-width, initial-scale=1.0" />
</head> --- 추가 설명 --
<meta> <!--정보-->
<meta/> <!--HTML 문서(웹페이지)의 제작자, 내용, 키워드 같은, 여러 정보를 검색엔진이나 브라우저에게 제공-->① charset(Character Set 단어의 약어)
: 문자인코딩 방식
= 화면에 표시하는 문자를 어떠한 방법으로 *인코딩 할 것이냐를 지정하는 HTML 속성
* 문자 인코딩(Encoding)이란
문자나 기호들을 컴퓨터가 이용할 수 있는 신호로 만드는 것을 말하며, 대표적인 한글 사용에서는 EUC_KR 혹은 UTF-8 등이 사용되며, 웹에선 UTF-8의 사용을 권장합니다.
<문자 처리 방식 ex>
EUC_KR (예전 방식) : "한"이라는 단어가 온전히 존재해야지만 문자를 출력할 수 있는 것이 있음
UTF-8(최근_거의 표준처럼 사용함) : 한 = > ㅎ ㅏ ㄴ 조합해서 출력
② name="viewport"
: 정보의 종류 (정보의 종류가 무엇입니까?)
-
스마트폰 or 태블릿에서 웹 사이트를 오픈할 수 있다.
-
스마트폰 = 모바일 장치(디바이스)
그런 모바일에서 웹 페이지의 가로 너비를 모바일 환경의 가로 너비와 일치시키거나, 웹 사이트가 처음 출력될 때 확대/축소 여부나 정도를 어떻게 결정하겠다 등 몇 가지 정보를 META 태그로 명시하는 개념이다.
즉, 모바일과 관련이 있고, 실제로 모바일과 대응하는 작업을 할 때 필요한 내용이다.
③ content
: 정보의 값 (그 정보의 종류의 실제 값이 무엇입니다)
요약
-
HTML 문서의 제목을 정의하는 것은? title
-
CSS 파일을 가져올 때는? link
-
CSS를 HTML 문서 안에서 작성하는 경우에는? style
-
자바스크립트 파일을 가져올 때는? script
-
정보를 나타내는 것은? meta
