<!doctype html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<title>HTML 기본 문서 구조</title>
</head>
<body>
<div id="wrap">
<h1>태그를 사용할 때는</h1>
<ul>
<li>소문자로 쓰기</li>
<li>적당히 들여쓰기</li>
<li>닫는 태그 확인하기</li>
</ul>
<img src="images/html.jpg">
</div>
</body>
</html>HTML 문서 내용은 태그를 사용하여 작성됩니다. 작성하려는 내용의 속성에 따라 알맞은 태그를 사용합니다. '<h1>태그를 사용할 때는</h1>'에서 <h1></h1>이 태그에 해당합니다. 여는 태그와 닫는 태그가 있으며 <img> 태그처럼 닫는 태그가 없는 태그도 있습니다. 태그는 소문자로 작성되며 태그마다 가질 수 있는 속성들이 있습니다. <img> 태그의 'src'가 그 예시입니다.
HTML 문서의 기본 구조는 아래와 같습니다.
<!doctype html>
- 작성하는 문서가 HTML5로 작성된 웹 문서라는 뜻입니다. 웹 브라우저에게 처리할 문서가 어떤 유형인지 알려주는 역할을 하죠. doctype은 대문자로 써도 무방합니다.
<html></html>
- 웹 문서의 시작과 끝을 나타내는 태그입니다. 웹 브라우저가 웹 문서를 읽을 때 HTML 문법에 맞춰 브라우저에 표시하도록 합니다. 'lang'이라는 속성을 사용해 문서에서 사용할 언어를 지정할 수 있습니다. 문서 정보를 저장하는 <head> 부분과 실제 화면에 보이는 내용을 입력하는 <body> 부분으로 나뉩니다.
<head></head>
- 웹 브라우저가 웹 문서를 해석할 때 필요한 정보들을 입력하는 부분입니다. 실제 브라우저에 출력되진 않습니다.
<title></title>에 적힌 문서 제목만 브라우저 창에 표시됩니다. 문서에서 사용할 외부 파일의 링크도 여기에 적습니다.
<meta>태그를 통해서는 문자 인코딩 방법과 문서 키워드, 요약 정보를 지정할 수 있습니다.
<body></body>
- 실제로 웹 브라우저 화면에 출력되는 내용들입니다. 대부분의 HTML 태그들이 이 안에 쓰입니다.
'코딩공부 > html, css' 카테고리의 다른 글
| [html] 표를 만드는 태그들 (table, th, tr, td, colgroup, col ...) (0) | 2022.01.11 |
|---|---|
| [html] 목록 만들 때 사용하는 태그들(<ul>,<li>,<ol>,<dl>,<dt>,<dd>) (0) | 2021.12.07 |
| [html] 텍스트를 한 줄로 묶는 태그들(<strong>, <b>,<em>, <i>,<q> 등) (0) | 2021.11.16 |
| [html] 텍스트를 묶는 태그들(<h1>,<p>,<br>,  등) (0) | 2021.11.08 |
| [html] HTML이란? (0) | 2021.11.08 |