[HTML/CSS] HTML 마크업 | HTML 마크업의 기초

HTML 마크업 분류

마크업 언어는 크게 순차적 마크업 언어(procedural markup language)와 서술적 마크업 언어(descriptive markup language)가 있다.

 

순차적 마크업 언어는 한 문서에 기본 데이터, 구조, 표현 정보가 저장되며, 문서 내용을 어떻게 시각적으로 표현할 것인가에 대한 정보를 비롯하여 폰트, 색상, 여백, 줄 간격 등 표현에 관련된 다수의 추가 정보가 포함된다.

 

반면, 서술적 마크업 언어는 기본 데이터와 구조만으로 이루어져 있기 때문에 제목, 부제목, 작가, 서론, 주소, 참고 도서 등의 구조 정보만 가지고 있다.

 

용어	설명
HTML(Hypertext Markup Language)	SGML에서 비롯된 하이퍼 텍스트를 표기하는 언어
XHTML(Extensible Hypertext Markup Language)	HTML과 동등한 표현 능력을 지닌 마크업 언어로, HTML 보다 엄격한 문법)
XML(Extensible Markup Language)	W3C에서 다른 특수 목적의 마크업 언어를 만드는 용도로 권고하는 다목적 마크업 언어

 

HTML 마크업의 기초

태그(tag)

시작태그와 종료태그로 나눌 수 있으며 '<>'로 감싸져있다.

기본 형식으로 시작태그는 "<tag>", 종료태그는 "</tag>"로 형태를 가지고 있다.

<br>과 같이 일부 태그의 경우 종료 태그를 가지지 않는 경우를 '빈 요소(empty element)'라고 한다.

<p>안녕하세요 HTML입니다.<br>만나서 반갑습니다.</p>

 

안녕하세요 HTML입니다.
만나서 반갑습니다.

 

속성(attribute)

시작 태그는 필요에 따라 정해진 속성을 가질 수 있으며, 사용할 수 있는 속성은 태그마다 다를 수 있다.

시작 태그 내에서 여러 개의 속성을 선언할 수 있는데, 속성과 속성은 공백으로 구분하여 지정해야한다.

속성에는 값을 가지지 않는 논리 속성도 있다.

 

<input type="text"id="user" requied>

 

요소(element)

시작 태그와 종료 태그 모두를 포함하여 ‘요소(element)’라고 하며, 요소는 아래의 코드와 같이 구성된다.

<p>안녕하세요 HTML입니다.</p>