본문 바로가기
코딩

html_html이란?

by 행운월드 2020. 7. 2.
반응형

 

안녕하세요. 행운공장 입니다.

 

 

이번 포스팅은 html에 대한 첫번째 포스팅입니다.

앞으로, 웹에 대한 기술을 배우는 대표적인 교육용 웹 사이트인 w3schools를 기반으로 포스팅을 이어갈 예정입니다.

 


 

1. html은 무엇인가요?

HTML은 웹 페이지를 표현하기 위한, 기본적이고 표준화된 마크업 언어입니다. HTML은 Hyper Text Markup Language의 약자입니다. 쉽게 말해서, 예를 들면 책을 읽으려면, 책속에 글씨들이 책의 내용을 구성하듯이, 웹페이지도 어떠한 내용을 보여주기 위해선, 글씨같은 요소들이 필요한데, html은 그런 글씨같은 역할을 하는 것들 중에서 가장 기본이 됩니다.

 

2. html은 무엇으로 이루어져 있나요?

html은 태그라는 요소로 이루어져 있습니다. 태그는 여러종류가 있습니다. 예를들어 웹뷰어 상단 탭에 보여지는 제목을 표현할 수 있는 <title>라는 태그를 예로 들 수 있습니다.

 

3. html의 구조는 어떻게 되어 있나요?

html의 구조는 아래와 같이 <html>태그가 전체를 감싸고, 그안에 <head>와 <body>태그로 이루어져 있습니다. 쉽게 눈사람을 생각하면 됩니다. 눈사람의 전체는 눈(=<html>)으로 쌓여져 있지만, 윗쪽에 머리(=<head>)와 아래쪽에 몸(=<body>)으로 나누어져 있습니다.

<html>
<head>
<title>페이지 제목입니다.</title>
</head>
<body>
<h1>이 페이지는 웹 페이지 입니다.</h1>
<p>웹 페이지의 내용들을 표현할 수 있습니다.</p>
</body>
</html>

 

이해를 돕기 위해서, 아래와 같은 그림을 준비해 보았습니다. html이 웹의 기본표현 언어이니, 우선 html이 가장 밖같은 감싸고 있고, 그안에 머리와 몸이 있는 구조입니다.

 

그런데, html의 태그는 기본적으로 열고 닫는 형식으로 구성되어져 있습니다.

여는 태그만 사용되거나, 닫는 태그만 사용되면 웹페이지에 제대로 표현되어지지 않습니다.

보통 여는 태그는, 태그이름 옆에 그냥 각괄호를 열고 닫기만 해주면 됩니다.

예를 들어 head 태그의 여는 태그는 <head>가 됩니다.

 

그렇다면, 닫는 태그는 각각의 여는 태그안에, 태그 이름 앞에 닫는다는 표시인, /를 넣어주면 됩니다.

예를 들면 head 태그의 닫는 태그는 </head>가 됩니다.


이번 포스팅은 여기까지 입니다. 다음에 또 다른 포스팅으로 돌아오겠습니다.

댓글