1-2. HTML구조
<!-- 문서의 기본구조 -->
<!doctype html>
<html>
<head>
...
</head>
<body>
...
</body>
</html><!doctype> : 문서유형선언문서의 유형을 지정하는 태그(같지만 태그가 아님)
html4에선 엄격모드, 호환모드, 프레임세트모드(기본값: 관용모드)등등 복잡하지만 html5에선 한줄로 끝
<!doctype>아니면 <!DOCTYPE>로 씀
<html> : 웹문서의 시작과 끝<head>와 <body>부분이 <html>과 </html>사이에 들어감
속성으로 lang이 쓰임
<html lang="언어코드"> ... </html>
lang으로 문서에서 사용할 언어를 지정가능
| 언어 | 독일어 | 영어 | 프랑스어 | 한국어 | 중국어 | 일본어 |
|---|---|---|---|---|---|---|
| 코드 | de | en | fr | ko | zh | ja |
이외에도 엄청 많은데, ISO 639-1(국제표준화기구 언어약어 정의규정)에 따라 2글자 or 3글자 코드 할당.
참고 : https://homzzang.com/b/html-156
<head> : 문서에 대한 정보부분문서의 실질적인 내용이 아닌, 문서의 정보나 설정, 연결된 문서에 대한 내용이 들어감
* <head>태그안에 들어가는 태그
- <meta>태그 :
문자 인코딩, 문서키워드, 요약정보등을 표시하는 태그 (http-equiv, content, name 속성이 있음)
http-equiv="항목명" : name 속성 대신하여 사용(웹 브라우저가 서버에 명령 내리는 속성)
content="정보값" : meta정보의 내용을 지정
name="정보이름" : meta정보의 이름을 정할 수 있음(지정 안하면 http-equiv와 같은 기능)
한글의 문자 인코딩방법(utf-8)을 지정하는 코드
<meta charset="utf-8">
검색엔진에 의해 검색된 단어 지정하는 코드
<meta name="Keywords" content="검색되는단어">
검색결과에 표시되는 문자 지정하는 코드
<meta name="Description" content="페이지설명">
제목 지정하는 코드
<meta http-equiv="Title" content="웹 표준">
자세한 meta태그 정보는 참고 링크 : https://webclub.tistory.com/354
- <title>태그 : 문서의 제목을 나타내는 태그
문서 제목 설정하는 태그
<title>문서의 제목입니다</title>
- <link> 태그 :
주로 외부 파일을 연결할때 사용하는 태그(css파트에서 자세히 설명) - <style> 태그 :
html문서 안에서 css를 그대로 사용하는 태그(css파트에서 자세히 설명) - <stript> 태그 :
스크립트를 그대로 사용하거나, 외부 스크립트를 불러와 사용하는 태그
<body> : 문서에 대한 실질적인 내용, 웹 문서의 모든 컨텐츠, 보여지는 요소가 이안에 위치
브라우저에 실제로 표시될 내용, 문서의 몸통<img>, <p> 태그같은 지금부터 배울 대부분의 태그가 <body>태그 안에서 사용됨, 직접적으로 보여지는 모든것이 여기서 표시되며, 실질적인 정보를 가지고 있는 부분.
'웹(Web) > HTML5' 카테고리의 다른 글
| 2. 시멘틱 태그 (0) | 2020.05.03 |
|---|---|
| 1-1. HTML이란, HTML상식, 기본 문법과 주요 태그, 특수기호 표기 (0) | 2020.05.02 |
