2019. 11. 24. 11:03ㆍ웹/HTML
META
웹 페이지 정보, HTML 문서(웹페이지)에 관한 정보(표시 방식, 제작자(소유자), 내용, 키워드 등)를 검색엔진이나 브라우저에 제공
|
속성 |
의미 |
값 |
|
charset |
문자인코딩 방식 |
UTF-8, EUC-KR 등 |
|
name |
검색엔진 등 제공하기 위한 정보의 종류(메타 데이터) |
Author, description, keywords, viewport 등 |
|
content |
name 이나 http-equip 속성의 값을 제공 |
|
※ META 태그 문서
HTML 요소 레퍼런스 MDN : https://developer.mozilla.org/ko/docs/Web/HTML/Element
속성
charset
-
문자 인코딩 방식
-
UTF-8 : 조합형(ㅈ ㅏ ㅂ ㅏ ㅅ ㅡ ㅋ ㅡ ㄹ ㅣ ㅂ ㅌ ㅡ)
-
EUC-KR : 완성형(자 바 스 크 립 트)
-
대부분 UTF-8 사용
content
-
name, http-equiv 속성 중 어떤것이 사용되느냐에 따라 속성의 값을 갖음
http-equiv
-
HTTP 헤더의 이름을 값으로 가짐
-
서버나 사용자 에이전트의 작동방식을 변경할 수 있는 지시를 정의
-
지시 값은 content 속성 안에 정의
name
-
문서 레벨의 메타데이터의 이름 정의, 정보의 종류를 정의
-
Itemprop, http-equiv 또는 charset 속성 중 하나라도 설정된 경우에는 설정하지 못함
-
Ex) author, description, generator, keywords 등
예제)
<!DOCTYPE html>
<html lang="ko">
<head>
<!-- 문자 인코딩 방식 설정 -->
<meta charset="UTF-8">
<title>Document</title>
<!-- 화면의 정보를 랜더링하기위한 영역 설정, 가로 사이즈를 장치에 맞춤, 확대 축소에 대해 기본값으로 1.0 로 설정 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author" content="오늘부터개발자">
<meta name="description" content="오늘부터개발자의 사이트 입니다">
<!-- 인터넷 익스폴로러에서 랜더링될 때 최신의 인터넷 익스플로러 랜더링 방식으로 설정 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="./main.css">
</head>
<body>
<span>테스트 !!!</span>
<div>테스트!!!테스트!!!테스트!!!</div>
</body>
</html>
설명
-
인터넷 익스폴로러에서 랜더링될 때 최신의 인터넷 익스플로러 랜더링 방식으로 설정
-
Viewport : 반응형 웹사이트 제공하기 위해 필요한 코드, 화면에 정보를 랜더링 하기 위한 영역을 설정하기 위한 정보
출처 : heropy.org
'웹 > HTML' 카테고리의 다른 글
| HTML - 컨텐츠 부문 HEADER / FOOTER / H1~H6 / MAIN (0) | 2019.12.11 |
|---|---|
| HTML - 요소 전역 속성 (0) | 2019.11.24 |
| 메타데이터 - LINK / STYLE / MIME Type / BASE (0) | 2019.11.24 |
| HTML 구조 (0) | 2019.11.24 |