위의 표만들기 태그는 다음과 같습니다.

→ 좌측 세로선을 긋고 데이타(귀여운여인)적고 우측 세로선을 긋는다.

예제 2)

사인암 

예제 3)

예제 4)

이번의 예제는 셀을 합치는 기능입니다. 일반워드에서 사용하는 표만들기에 비해서 많이 불편하지만 규칙만 아시면 어렵지 않게 작성 하실 수 있습니다.

먼저 위의 표는 2행 6렬로 구성 되어 있다고 생각하시면 됩니다. 그런 다음 1행을 합치면 됩니다

※ 열을 합치는 명령(TD ROWSPAN=n) n은 합치는 갯수입니다. 행을 합치는 명령(TD COLSPAN=n)

예제 5)

위의 예제는 테이블의 크기를 화면의 50%로 설정하고 화면의 가운데 정렬을 하였고 좌측의 화면정렬은 상하 가운데 정렬과 좌우 정렬을 동시에 하였습니다.

예제 6)

(2) 고급태그

홈페이지에 이미지 나타내는 방법과 연결기능을 가진 이미지를 나타내는 방법을 설명하도록 하겠습니다.

1) 배경이미지 넣기

바탕이미지와 같은 말이며 바탕에 자신만의 로고를 엷게 깔던가 회사의 전경을 엷게 바탕에 깔면 됩니다. 메인 창에서 FRAME1, FRMAE3에 바탕화면을 넣어습니다.

구성:, < BODY BGCOLOR="#000000">

바탕화면으로 BACK.GIF를 넣는다면 다음과 같이 태그를 하시면 됩니다.

.......→절대경로

바탕에 단순히 색상만 넣는다면 아래와 같이 태그를 하시면 됩니다.

.......

2) 이미지 배치하기

이제는 바탕전체를 이미지로 사용하는 것이 아니라 일부분만 나타내고자 할 때 사용하시면 됩니다.

구성:

이미지 하나를 화면의 중앙에 배치하고자 하시면 아래의 태그를 이용하시면 됩니다.

→ 상대경로

="" se-text-paragraph-align-justify="" se-text-paragraph="">

※절대경로와 상대경로

HTML문서와 이미지가 많으면 데이타 관리에 어려움이 많이 있습니다. 같은 서버에서 각각의 홈페이지마다 같은 이미지를 중복으로 가지고 있다면 하드의 낭비가 심하게 되겠죠. 따라서 이미지만 관리하는 폴더를 두고서 HTML작성시 이미지만 당겨서 사용하는 것이 경제적이죠.

이와같이 공용이미지 폴더를 두고서 경로를 지정하는 것을 절대경로라 합니다. 그러나 필요한 이미지만 항상 현재의 폴더 밑에 두고서 관리하고자 한다면 상대경로로 지정하셔야만 합니다.

개인의 홈페이지는 자신의 폴더밑에 이미지 폴더를 관리하는 상대경로가 되어야 합니다.(자신의 폴더명이 어떻게 되는지는 관리자가 아니면 어렵죠)

3) 아이콘 이미지에 연결 기능을 추가하기

이미지를 무작정 띄우기만 한다면 별 의미가 없습니다. 따라서 이미지를 누르면 연결되는 태그를 배워보도록 합시다. 여기에 대한 예제는 초급태그, 중급태그에서 메모 이미지를 누르면 연결되는 것을 보셨을 것입니다. 따라서 태그만 설명하기로 하겠습니다.

구성:

만일 메모 이미지만 가지고 의사 전달이 정확히 전달되지 않아서 이미지 옆에

메세지(눌러주세요)를 적고서 메세지를 클릭하면 연결되는 태그를 작성하도록 하겠습니다.

구성:눌러주세요

4) 이미지를 대체하는 옵션

이미지 자동로드 기능을 꺼두거나 이미지가 제대로 전송되지 않았을 때 홈페이지를 방문한

손님에게 이미지를 대신할 문구를 제공한다면 좋지 않을까요. 문구를 "메모그림"이라고 표현하고 싶으면 아래와 같이 태그를 주시면 됩니다.

구성:

5) TEXT와 이미지를 혼합하여 배치하기

예제)

홈페이지에서 이미지를 사용하는것은 홈페이지를 만든 사람이나 이를 검색하는 사람 모두에게 큰 관심거리가 되는것은 명백한 사실입니다. 보다 더 휼령한 그래픽을 자신의 홈페이지에 띄우고 이에 맞게 디자인하더라도 독자들이 이러한 홈페이들을 전송받는데 시간이 너무 걸려서 결국 포기하고 다른 홈페이지로 떠나버린다면 무슨 의미가 있겠습니까?

※ 글자를 중심으로 배치할 경우

왼쪽(LEFT):이미지를 글자의 왼쪽에 배열합니다.

오른쪽(RIGHT):이미지를 글자의 오른쪽에 정렬합니다.

중앙(CENTER):이미지를 문서의 가운데로 정렬시켜 줍니다.

※ 그림을 중심으로 배치할 경우

위 (TOP):글자를 이미지의 가장 윗부분에 정렬시킵니다.

중 간(MIDDLE):글자를 이미지의 중앙선에 정렬시킵니다.

아 래(BOTTOM):글자를 이미지의 가장 밑부분에 정렬시킵니다.

만일 아무런 속성이 주어지지 않는다면 기본값은 BOTTOM입니다.

따라서 위의 배치가 되려면 태그는 다음과 같습니다.

그림이 글자의 왼쪽에 배치되므로 ALIGN=LEFT이 되어야 합니다.

홈페이지...

(3) 고급태그

최근의 추세는 개인 홈페이지의 경우에도 다양한 멀티미디어를 적용시키는 것입니다. 개인이 만든 비디오를 인터넷 상에 올리거나 자신의 음성을 다른 사람들이 들을 수 있도록 만들어 놓는 등

재미있는 홈페이지를 많이 볼 수 있습니다. 따라서 여기서는 자신의 홈페이지에 사운드와 동영상을 넣는 방법에 대해서 공부하여 보겠습니다.

1) 홈페이지에 사운드 추가하기

사운드 파일의 종류에는 다음과 같은 종류가 있습니다.

파일종류 설 명

AU : JABA로 유명한 미국의 SUN사에서 만든 사운드

파일로 확장자는 *.AU입니다.

이 파일은 넷스케이프에서 기본적으로 제공하는

NAPLAYER를 이용하여 들어 볼 수 있습니다.

WAV : WAV 파일은 MS사가 개발한 사운드 파일입니다.

윈도우에서 기본적으로 제공하는 매체 재생기를

통해서 재생시킬 수 있습니다.

RA : Real Audio는 온라인 상태에서 바로 들을 수

있다는 장점 때문에 가히 폭발적인 인기를 끌고

있는 사운드 파일의 한 종류입니다.

확장자는 *.RA인데, 다운로드되면서 바로 들을 수

있기 때문에 음질은 다소 떨어지지만 인터넷 전용

의 사운드 파일로 많이 애용되고 있습니다.

구성은 이미지 링크와 마찬가지로 태그를 주면 됩니다.

(예제) 도담삼봉 배경음악

(결과) 도담삼봉 배경음악

2) 홈페이지에 동영상 추가하기

동영상 파일의 종류에는 다음과 같은 종류가 있습니다.

파일종류 설 명

MOV : Quick Time이라는 Apple사의 동영상 압축 기술은 매

킨토시 전용의 동영상 지원 소프트웨어입니다.

MPEG : 동영상 파일 중에서 가장 압축 효율이 좋다는 MPEG 파일

은 확장자로 MPG를 가집니다. 이것은 현재 WEB의 표준

으로 자리잡고 있습니다.

AVI : 마이크로소프트사에서 만든 비디오 파일 포맷으로 윈도

우즈에 기본 장착 되어있는 매체 재생기를 이용하여 비

디오 파일을 열어볼 수 있습니다.

구성은 사운드 링크와 마찬가지로 태그를 주면 됩니다.

(예제) 여기를 누르면 볼 수 있습니다.

(결과) 여기를 누르면 볼 수 있습니다.