HTML - Hyper Text Markup Language
html5는 다음과 같은 기능들이 추가되었다.
- 멀티미디어
비디오 및 오디오 자체지원 - 그래픽
3차원 그래픽 지원 - 통신
소켓통신 지원으로 양방향 통신가능 - 디바이스 접근
카메라 동작센서 등 하드웨어 기능 직접 제어 - 오프라인 저장소
오프라인 상태에서도 어플리케이션을 동작 - 시맨틱 태그
HTML 요소의 의미를 명확히 설명하는 시맨틱 태그를 도입 - CSS3
HTML5 문서는 반드시 <!DOCTYPE html>으로 시작하여 문서 형식(document type)을 HTML5로 지정한다.
실제적인 HTML document은 <html>과 </html> 사이에 기술한다.
<head>와 </head> 사이에는 document title, 외부 파일의 참조, 메타데이터의 설정 등이 위치하며 이 정보들은 브라우저에 표시되지 않음.
웹브라우저에 출력되는 모든 요소는 <body>와 </body> 사이에 위치함.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello World</title>
</head>
<body>
<h1>Hello World</h1>
<p>안녕하세요! HTML5</p>
</body>
</html>
HTML5 문법
1. 요소 element
HTML 요소는 시작 태그(start tag)와 종료 태그(end tag) 그리고 태그 사이에 위치한 content로 구성된다.
HTML요소는 시작태그와 종료태그 태그 사이에 위치한 contents로 구성된다.
- 요소의 중첩
HTML document는 요소들의 집합으로 이루어진다.
요소는 중첩될 수 있다. 이 때 부자관계가 성립되며 이를 통해 정보를 구조화한다.
<body>
<h1>Hi</h1>
<p>there</p>
</body> 이러한 중첩을 통해 웹사이트의 구조를 표현한다.
- 빈 요소 (Empty Element)
content를 가질 수 없는 요소를 빈 요소(Empty element or Self-Closing element)라 한다
<meta charset="utf-8">이 외에도 br, hr, img, input, link, meta 등이 있다.
2. 어트리뷰트 attribute
어트리뷰트(Attribute 속성)이란 요소의 성질, 특징을 정의하는 명세이다.
어트리뷰트는 시작 태그에 위치해야 하며 이름과 값의 쌍을 이룬다. (e.g. name=”value”)
<img src="html.jpg" width="104" height="142">
//src => 어트리뷰트 명
//"html.jpg" => 어트리뷰트 값
더 높은곳으로 올라가기