HTML이란?
HTML이란 HyperText Markup Language의 약자로 웹브라우저에서 보여지는 문서의 내부 형식을 규정하는 마크업 언어입니다. 마크업 언어는 태그 등을 이용하여 문서나 데이터의 구조를 명기하는 언어의 한 가지입니다. 마크업 언어라는 용어는 예전의 활자 시대에 인쇄 교정지에 펜으로 표시하는 수기형태의 주석을 뜻하는 '마크-업(mark-up)'에서 유래 하였습니다.
HTML은 요소(elements)로 구성되어 있으며 요소는 내용과(contnet)와 이를 둘러싼 태그(tag)로 구성됩니다. 요소에 추가정보를 주기 위해서 속성(attributes)를 사용합니다. 아래는 기본적인 HTML5 문서 구조입니다.
<!DOCTYPE html>
<html>
<head>
<title>HTML 시작하기</title>
</head>
<body>
<h2>Hello World!</h2>
<p>단락 내용</p>
</body>
</html>문서 형식 선언
HTML 파일의 첫 줄에는 문서의 종류를 알리기 위해서 <!DOCTYPE ....>의 문서형식 선언으로 시작합니다. 웹 문서를 표현하는 HTML 문서규약은 지속적으로 개선되며 새로 만들어지고 있으므로 동시에 여러 버전이 사용될 수 있습니다. 따라서 HTML 문서에 DOCTYPE 정보가 없으면 웹 브라우저에서 HTML 버전의 정보를 정확히 알 수 없으므로 웹 문서를 해석하는데 잘못 처리할 수 있습니다. HTML5 문서규약에 맞춰 작성된 웹 문서를 처리하기 위해서는 위 예와 같이 <!DOCTYPE html>로 선언해 주면 됩니다.
HTML 버전 4.01의 경우<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">을 사용했다.
요소(Element)와 태그(Tag)
요소는 문서 일부분의 특징을 지정하는 명령어라고 할 수 있습니다. 요소는 내용과 이를 둘러싼 태그(tag)로 구성되어 있습니다.
<div>내용</div>
바로 위 코드 전체를 요소라 하고 내용을 둘러싸고 있는 <div>는 태그입니다. 태그는 시작태그(<태그이름>)의 종료태그(</태그이름>)가 있습니다.
웹 브라우저에서 종료 태그가 없더라도 있는 것으로 간주하여 문제없이 처리되는 요소도 있다. 예를 들어 <img> , <br> , <hr>이 있다.
속성(Attribute)
속성은 요소에 추가정보를 주기 위해서 사용합니다. 속성은 요소의 시작 태그 내에 나타내며 속성의 이름과 속성값의 쌍으로 구성되어있습니다. 이름과 속성값 사이에는 '=' 문자가 나타나고, 속성값은 큰따옴표(" ") 나 작은따옴표(' ')로 감싸서 나타냅니다.
<div id = "example1"> Hello World! </div>
<p id = "id01" class = "class01" title = "title01"> Hello World!! </p>
하나의 요소는 여러개의 속성을 가질 수 있으며, 이 경우 각 속성은 빈칸으로 구분합니다.