HTML 문서의 기본형식 ■■■■
■■■■■■■■
■■■■■■■■■■■■

☜DB Lab. ▲홈페이지 작성법 ◀Prev. Chap. ▶Next Chap.

HTML 문서는 HEAD와 BODY 두 부분으로 나누어진다.
HEAD는 문서의 설명부분이고 BODY는 문서의 내용을 기술하는 부분이다.
기본 형태는 다음과 같다. 
  <HTML>                               HTML 문서의 시작
    <HEAD>                              문서의 설명
      <TITLE>문서의 제목</TITLE>         브라우저의 상단에 표시
     </HEAD>
     <BODY>       
         ...내용부분...                  텍스트와 그림이 들어간다.
     </BODY>
   </HTML>                              HTML 문서의 끝

위에서 보는 바와 같이 HTML은 여러개의 tag로 구성된다.
Tag는 문자나 문단의 표현형태를 지정하는 일종의 명령어로, 문서 중 간 중간에 삽입된다.
Tag는 < > 로 둘러싸이며 웹 브라우저에 의해 일 반 텍스트가 아닌 HTML 명령어로 해석된다. 따라서 화면에는 보이지 않고, 대신 해당 문서의 각종 형태를 만든다.

가장 기초적인 tag를 이용해 홈페이지를 간단하게 만들어보자.
[결과를 보시려면 여기를 누르세요]
   <HTML>
   <HEAD>
   <TITLE>기본형식 예</TITLE>
   </HEAD>
   <BODY BACKGROUND="/background/shadbak1.jpg">
      <CENTER>
      <H1>
      홈페이지 만들기 예제입니다.
      </H1>
      <HR>
      <P>
        산의 푸르름에  싸여있는 <A HREF="http://www.changwon.ac.kr/">
        창원대학교</A>를 방문해 주셔서 감사합니다.<BR>
        이곳 저곳 구경하실 때 즐거운 시간이 되리라 믿습니다.<BR>
      <P>
      <IMG SRC="/icons/redfoot.gif" hspace=5>
      <A HREF="/information/guide/panorama.html">창원대학교전경</A><BR>
      <IMG SRC="/icons/redfoot.gif" hspace=5>
      <A HREF="/information/timetable/daily.html">학사일정 안내</A><BR>
      <IMG SRC="/icons/redfoot.gif" hspace=5>
      교내안내도<BR>
      <IMG SRC="/icons/redfoot.gif" hspace=5>
      <A HREF="/information/telephone/tel.htm">학내 전화번호</A><BR>
      <P>
      <HR>
      궁금한 사항이나 요청사항이 있으면 <address>
      <A HREF="mailto:ytwoo@sarim.changwon.ac.kr">
       w3master@sarim.changwon.ac.kr</A>로 메일 주세요. </address>
      </CENTER>
     </BODY>
   </HTML>
그러면 위의 문서를 살펴보자.
BODY tag를 보면 BACKGROUND가 있다. 이것은 웹 브라우저의 배경 그림을 지정해 주는 것으로 이와 같은 것을 attribute라 한다. 이러한 attribute를 사용함으로써 보다 나은 HTML문서를 구성할 수 있다.

HTML문서는 여러 문서를 연결하여 보다 나은 의미 전달을 할 수 있 으며
<A HREF="http://sarim.changwon.ac.kr/">창원대학교</A>
와 같이 tag를 사용하여 창원대학교를 다른 문서에 링크 시킬 수 있다.
이 때 링크된 부분은 다른 부분과 색깔이 다르게 나타난다. 그 부분을 마 우스로 누르면 링크된 문서가 웹 브라우저에 나타난다.

HTML문서는 그림을 쉽게 불러 사용할 수 있다.
이는 텍스트 위주의문서보다 의미 전달이 쉽고 지루함을 덜 수 있다.
그러나 너무 많은 그림을 사용하면 다른 사람이 접속하는데 시간이 많이 걸리므로 피하는 것이 좋다. HTML문서에서 그림화일을 사용하려면 <IMG SRC> tag를 사용하 면 되고 여러 attribute를 사용하여 그림의 크기, 여백, 그림 옆의 문자 의 위치 등을 조정할 수 있다.

<HR> tag를 사용하여 수평 줄을 문서의 원하는 곳에 위치시킬 수 있 어 내용의 구분을 쉽게 할뿐만 아니라 보기도 좋아진다.

☜DB Lab. ▲홈페이지 작성법 ◀Prev. Chap. ▶Next Chap.
DB Lab. Home Welcome to Database Laboratory in Changwon National University ! Univ. Home
Drop any comments or suggestions to : ytwoo@sarim.changwon.ac.kr
Copyright(C) 1996. YongTae Woo, Database Laboratory, Changwon National University
Tel. 82-551-79-7423 Fax. 82-551-79-7680 All rights reserved.