본문 바로가기
Study/HTML + CSS

HTML 기본 지식

by arthur_noh 2022. 4. 23.

1. HTML 의 정의

HTML 은 HyperText Marup Language 를 의미한다.

* HyperText : 하이퍼링크를 통해 어떤 문서에서 다른 문서로 접근할 수 있는 텍스트
* Markup : (콘텐츠를) 표시하다.
* Language : 언어

=> 하이퍼 텍스트와 콘텐츠를 표시해주는 언어

정리하면 HTML은 웹 브라우저를 통해 표시되는 웹 페이지의 콘텐츠를 정의하기 위해 사용되는 언어이다.

 

2. HTML의 동작 방식

html의 동작방식

HTML은 웹 페이지의 콘텐츠를 정의하기 위해 사용되는 언어이다.

개발자는 HTML 코드로 웹 페이지에 표시될 내용을 정의한 HTML 문서를 만든다.

완성된 HTML 코드를 웹 브라우저에서 로딩하면 웹 페이지가 만들어진다. HTML 코드가 웹 브라우저를 통해 해석되고 표현되는 과정을 렌더링이라고 한다.

 

3. HTML 파일

HTML 문서의 파일 확장자는 html 또는 htm 이다.

 

4. HTML 문법

HTML의 문법은 태그(tag) 한가지만 기억하면 된다.

tag란?

=> HTML 코드에서 콘텐츠를 정의하는 형식

 

4-1. 태그의 사용법

태그는 <> </> 기호를 사용하여 콘텐츠의 시작과 끝을 표시한다.

각 태그는 콘텐츠를 감싸며, 태그명은 콘텐츠의 성격과 의미를 나타낸다.

태그 사용 예시
<태그명> 콘텐츠 </태그명>

 

: 단일태그

경우에 따라서는 시작과 끝을 구분할 필요가 없는 태그가 존재한다. 이를 단일태그라고 한다.

단일태그 예시

<태그명>
<태그명/>

 

: 속성

속성은 태그의 부가적인 기능을 정의하는 것으로 선택사항이다. 속성은 시작태그 내부에 정의한다. 속성의 갯수에는 특별한 제한이 없다.

속성이 추가된 태그 예시

<태그명 속성명="속성값"> 콘텐츠 </태그명>
<태그명 속성명="속성값" />

=> 태그명과 속성 정의는 공백(space)으로 구분하며, 속성값은 큰 따옴표(" ")를 사용한다.

 

: 주석

주석은 사람에게는 보이지만, 컴퓨터에게는 보이지 않는 코드를 의미한다. 주로 코드에 대한 메모를 남기는 용도로 사용된다.

HTML 주석의 예시
<!-- 주석을 작성하시오. -->

=> 태그와 형식이 다르긴 하지만, 주석 또한 기호를 통해 시작과 끝을 구분한다.

 

 

 

'Study > HTML + CSS' 카테고리의 다른 글

[CSS] rem, em 차이  (0) 2022.04.23
HTML 문서 기본구조  (0) 2022.04.23