html 언어의 기본구조

오늘은 홈페이지 제작에 있어 기초가 되는 html 언어에 대해 알아보았습니다.

처음에는 html 명령어, html 태그, html 언어, html 용어 등으로

검색해 보았는데요, 기초를 모르니깐, 알아보기도 피곤했네요.^^

아무튼, 시간이 나는김에 기초부터 알아보자는

생각에 html 언어 태그 부터 알아보았습니다.^^

 

HTML 이란 Hyper Text Mark-up Language의 줄임말입니다.

 

하이퍼텍스트 마크업 랭귀지가 뭔고하니.. 랭귀지라는 말에서 언어임을 알 수 있습니다.

 

HTML이라는 마크업 언어는 태그로 이루어져 있습니다.

 

태그란 < > 로 시작해서 </ >로 끝나는 문장입니다.

 

예를들어 글자의 크기를 바꾸고 싶다고 하면

 

<font size=7>큰 글자</font>

 

이런게 태그죠.

 

웹사이트는 태그로 이루어져 있습니다.

 

태그는 홈페이지를 이루는 자재(벽돌) 같은거죠.

 

태그는 여러가지 기능을 하는 다양한 종료가 있습니다.

 

이미지를 삽입하는것은 <img>

테이블을 삽입하는것은 <table>

스크립트를 삽입하는것은 <script>

폼을 삽입하는것은 <form>

등등..

 

그리고 태그는 속성(attribute) 를 가지고 있는데요.

 

<img src=http://주소.jpg> 이건 이미지 태그에 주소를 지정한거구요

<img src=http://주소.jpg width=100 height=100> 이건 이미지 태그에 주소와 크기를

<img src=http://주소.jpg width=100 height=100 alt=""> 이건 이미지에 말풍선을 지정하는거구요..

 

이런식으로 태그마다 다양한 속성을 가지고 있습니다.

 

또 태그마다 다양한 원소(element)도 가지고 있지요.

 

<table border=1><!-- table 태그 -->

<tr><!-- table 태그의 첫번째 원소 행을 나눔 -->

<td><!-- tr태그의 첫번째 원소, 셀을 나눔 -->

1

</td>

<td><!-- tr태그의 두번째 원소, 셀을 나눔 -->

2

</td>

</tr>

</table>

 

<form name=f><!-- form 태그 -->

<input type=text name=t><!-- form태그의 첫번째 원소-->

<input type=button><!-- form태그의 두번째 원소-->

</form>

 

이처럼 태그만 알면 모든종류의 사이트를 제작할 수 있습니다.

 

태그를 모르거나, 쉽게 만들기 위한 도구로 웹저작툴(나모, 드림위버)등이 있습니다.