첫 번째 만드는 HTML 문서, "Hello, HTML"
먼저 메모장을 열어 다음처럼 HTML 문서를 편집하세요.
<!DOCTYPE html>
<html>
<head>
<title>Hello, HTML5</title>
<meta charset="utf-8" />
</head>
<body>
<p>안녕하세요. 언휴예요.</p>
</body>
</html>
first.html 이름으로 저장하신 후에 더블 클릭하여 확인하세요.
<!DOCTYPE html>
현재 문서가 어떤 형식에 맞게 제작했는지 설명합니다.
HTML5, XHTML, HTML의 세 가지 유형이 있습니다.
웹표준과 접근성을 높이기 위해 HTML 문서의 첫번째 행에 공백없이 선언합니다.
이를 생략하면 비표준모드로 렌더링하여 일부 브라우저에서 문제가 발생할 수 있어요.
<html>...</html>
HTML 문서는 <html> 시작 태그로 시작하여 </html> 종료 태그로 종료합니다.
<head>...</head>
문서를 설명하는 메타 정보를 나타내는 영역입니다.
문서 제목이나 문자 인코딩 정보등을 작성할 수 있습니다.
<title>Hello, HTML5</title>
문서 제목으로 브라우저를 실행할 때 타이틀 바에 표시합니다.
<meta charset="utf-8" />
문자 인코딩을 표현한 것입니다. 다른 문자를 사용하는 중국어나 일본어 등을 사용할 때 깨지지 않게 하려면 utf-8로 설정하세요. 영어는 깨지지 않습니다.
<body>...</body>
페이지 본문을 감싸는 영역입니다.
<p>안녕하세요. 언휴예요.</p>
문단을 의미하는 태그입니다.
'언어 자료구조 알고리즘 > HTML5' 카테고리의 다른 글
[HTML5] 6. 안전한 구조를 위해 br 태그에 종료를 표시하자. (0) | 2016.05.05 |
---|---|
[HTML5] 5. 소스 코드를 본문에 포함할 때는 pre 태그를 사용! (0) | 2016.05.05 |
[HTML5] 4. 주석으로 가독성을 높이자. (0) | 2016.05.05 |
[HTML5] 3. 글자가 이상하게 보일 때 깨지지 않게 meta태그에 인코딩 설정 (0) | 2016.05.04 |
[HTML5] 2. 간단해진 HTML 문서 형식 선언 <!DOCTYPE html> (0) | 2016.05.04 |
[HTML5] 이미지 (0) | 2016.04.09 |
[HTML5] 테이블 (0) | 2016.04.09 |
[HTML5] 목록 태그 <ul>, <ol>, <dl> (0) | 2016.04.09 |
[HTML5] P 태그와 PRE 태그 (0) | 2016.04.09 |
[HTML5] 시맨틱 태그와 CSS (0) | 2016.04.09 |