Main.HTML
<FRAMESET ROWS="80%,20%">
<FRAMESET COLS="30%,70%">
<FRAME SRC="Menu.HTML" NAME="Menu"> <!--해당 프레임의 이름을 지정한다.
<FRAME SRC="Photo5.HTML" NAME="Right">
</FRAMESET>
<FRAME SRC="Banner.HTML" NAME="Banner">
</FRAMESET>
<H2>메뉴창</H2><BR><BR>
<A HREF="First.HTML" TARGET="Right">나의 소개</A><BR><BR> <!--링크연결시 타겟에 프레임의 NAME으로 연결
<A HREF="Photo5.HTML" TARGET="Right">포토앨범</A><BR><BR>
<A HREF="TABLETag6.HTML" TARGET="_blank">회원가입</A><BR><BR> 홈페이지 방문시 브라우저 창에서 텍스트가 흐르는 효과:<MARQUEE>태그
<BODY>
<MARQUEE DIRECTION="left">흐르는 글자</MARQUEE><BR>
<MARQUEE DIRECTION="right">흐르는 글자</MARQUEE><BR>
<MARQUEE DIRECTION="right" HEIGHT="100" WIDTH="100">흐르는 글자</MARQUEE><BR>
<MARQUEE DIRECTION="right" HSPACE="10" VSPACE="10">흐르는 글자</MARQUEE><BR>
<MARQUEE DIRECTION="right" BEHAVIOR="alternate">흐르는 글자</MARQUEE><BR>
<MARQUEE DIRECTION="right" LOOP="5">흐르는 글자</MARQUEE><BR>
<MARQUEE DIRECTION="right" SCROLLDELAY="200">흐르는 글자</MARQUEE><BR>
<MARQUEE DIRECTION="right" SCROLLAMOUNT="5">흐르는 글자</MARQUEE><BR>
<MARQUEE DIRECTION="right" BGCOLOR="red">흐르는 글자</MARQUEE><BR>
</BODY> <MARQUEE>태그의 DIRECTION속성을 left, right로 설정하여 흐르는 방향값을 줄 수 있다.
또한 HEIGHT와 WIDTH속성을 사용하여 글자가 흐르는 범위(높이,폭)를 지정할 수 있고 HSPACE와 VSPACE속성으로 글자가
흐르는 범위와 상하 좌우 여백을 지정해 줄 수 있다.
BEHAVIOR속성값 'alternate'를 입력하여 브라우저 창의 양끝에 글자가 도착하면 다시 반대방향으로 되돌아움직이게 할 수 있다.
LOOP속성을 사용하여 글자가 수치만큼 반복하여 흐르게 한다.
SCROLLAMOUNT속성을 사용하면 한번에 글자가 수치만큼 울직이게 한다.
SCROLLDELAY속성값을 '200'으로 지정하면 글자가 1/5초마다 나타나도록 한다.
BGCOLOR속성을 사용하여 글자가 흐르는 부분을 붉은색으로 지정한다.
이미지맵 만들기
지금까지 하나의 그림에 하나의 링크만 지정할 수 있다고 배웠으나 그림을 나누어 여러개의 링크를 지정하는 것이 가능하다. 이것을 이미지 맵이라고 한다.
이미지맵을 만들기 위해서는 <IMG>태그의 USEMAP속성을 사용한다. 속성값은 '#맵이름'형식으로 한다. 그 후 <MAP>태그를 사용하여 삽입한 그림의 어떠한 부분에 링크 시킬 것인지 지정한다. <MAP>태그 안에는 <AREA>태그를 사용하는 데 이 태그를 사용하여 영역을 지정하게 된다.
<IMG SRC="1.JPG" USEMAP="#001" WIDTH="400" HEIGHT="400">
<MAP NAME="001">
<AREA SHAPE="rect" COORDS="5,5,100,50" HREF="1.JPG">
<AREA SHAPE="circle" COORDS="100,100,50" HREF="2.JPG">
<AREA SHAPE="poly" COORDS="100,50,200,60,250,50,270,100,250,150" HREF="3.JPG">
설명
<AREA>태그의 SHAPE속성은 링크를 지정할 영역의 모양을 설정하는 역할을 한다. 값으로는 'rect'(X,Y,아래의X,Y),'circle'(X,Y,원의반경),'poly'(다각형) 3가지가 있는데 이에 따라 COORDS값을 지정하는 방식도 변하게 한다.
각치수는 모양에 따른 꼭지점의 위치이다.
메타태그 사용하기
<META>태그는 웹 페이지의 내용을 담고 있는 웹 브라우저에 정보를 전달하는 역할을 한다. 하지만 그 이외에 다른 기능들이 있다.
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=euc-kr"> <!--한글깨짐방지"-->
<META HTTP-EQUIV="Refresh" CONTENT="5;URL=http://longkim.tistory.com"> <!--일정시간 REFRESH-->
<META NAME="AUTHOR" CONTENT="홍길동"> <!--웹페이지를 만든사람정보를 표시하기위해 META태그이용-->
<META NAME="COPYRIGHT" CONTENT="친구들">
<BODY>
메타태그사용하기<BR>
메타테그는 다른 테그로 정의할 수 없는 정보를 지정 할 때 사용한다.
</BODY> 멀티미디어 사용하기
웹페이지에는 동영상이나 음악도 삽입할 수 있다. 삽입하는 방법은 여러가지 있지만 대표적인 <EMBED>태그를 사용해보자
<EMBED>태그는 플러그인 프로그램을 사용해서 표시되는 데이터나 동여상을 웹페이지에 삽입하기 위해 사용하는 태그이다.
플러그인이란?) 플러그인이란 다른 말로 추가 기능이라고 할 수 있다. 웹 브라우저에 없는 기능을 보완하기 위하여 설치하는 프로그램이다. 플러그인 프로그램은 독립적으로 실행되지 못하여 웹브라우저와 함께 동작한다.
<BODY>
뮤직비디어<BR>
<EMBED SRC="UCC.avi" WIDTH="300" HEIGHT="300">
</BODY>
<EMBED>태그를 사용하여 동영상을 삽입한다. 삽입합 동영상은 WIDTH속성과 HEIGHT속성을 사용하여 크기지정이 가능하다.
또한 EMBED에 SRC속성으로 파일경로를 지정하여 삽입할 수 있고 NAME으로 이름을 지정할 수 도 있다. AUTOSTART의 'true'/'false'로 자동실행여부값을 줄 수 있고 HIDDEN속성을 사용하여 웹페이지에 삽입한 동영상 화면의 표시 여부를 지정할 수 있다. AUTOSTART와 마찬가지로 ' true'/'false'값으로 줄 수 있다.
+<IMG>태그의 DYNSRC속성으로 동영상삽입이가능하다.
형식)<IMG DYNSRC="동영상 URL">
<OBJECT>태그는 동영상 플레이를 할 수 있는 플레이어가 자신의 컴퓨터에 설치되어 있어야 하지만 <OBJECT>태그는 웹 상에서 로드에서동영상 플레이하므로 특별한 프로그램없이 실행이 가능하다. <OBJECT>태그를 사용하여 플래시,퀵타임무비,리얼비디오 등의 삽입이 가능하다.
형식)<OBJECT DATA="동영상URL">..</OBJECT>
음악삽입
웹페이지에 방문한 사람들을 위해 배경음악도 지정할 수 있다. 배경음악으로 지절 할 수 있는 음악 파일의 형식은 WAVE,AIFF,AU,MID등이 있다. 배경음악을 삽입하기 위해서 <BGSOUND>태그를 사용하며 SRC속성으로 음악 파일의 경로를 지정하고 LOOP속성으로 재생 횟수를 지정할 수 있다.
<BODY>
<BGSOUND SRC="Start.wav" LOOP="infinite">
</BODY>
'Not Using > Java script/HTML/CSS' 카테고리의 다른 글
CSS 계속 (0) | 2011.11.15 |
---|---|
CSS (0) | 2011.11.15 |
TAG_ATTRIBUTE3 (0) | 2011.11.15 |
TAG_ATTRIBUTE2 (0) | 2011.11.14 |
HTML의 기본구조 (0) | 2011.11.13 |