#04 marquee 태그 배우기

오늘은 마키(marquee)태그에 대해서 배워보겠습니다.

마키태그는 다양한 칼러의 바탕색에 역시 다양한 칼러의 글씨가 지나가게 만드는 다이내믹한 태그입니다.

먼저 당양하게 중간에 마키소스만 직접 넣어서 저장은 htm파일로 바꿔서 확인해볼수 있게 텍스트 문서를 첨부하였습니다.

다운로드 받아서 가운데 마키태그만 다양하게 삽입해보고 저장후 htm문서 새로고침을 통해 변화를 확인해 보시기 바랍니다.

 

기본 htm 실습용.txt

다운로드

 

 

마키태그 속성 명령어들

 

bgcolor=[색상] // 배경색상을 설정 합니다
width=400 height=300 // 가로, 세로 크기를 설정 합니다
direction="left[right|up|down]" // 스크롤 방향을 설정 합니다
behavior=scroll[slide|alternate] // 움직임 속성을 지정합니다 (scroll : 한쪽방향으로 반복 스크롤 됩니다, slide : 스크롤되어와서 엄춤, alternate : 왼쪽, 오른쪽으로 반복 스크롤)
loop=3 // 반복횟수를 설정 합니다
scrollamount="3" // 스크롤 되는 거리간격을 픽셀단위로 설정 합니다
scrolldelay="200" ; 0.2초 // 스크롤 속도를 설정 합니다. 200 이 기본값입니다
hspace="50" vspace="50" // 아래위의 여백을 지정할 수 있습니다

<marquee align=bottom,middle,top> : 각각 문자열을 아래,중간,위쪽으로 위치
<marquee height,width,hspace,vspace> : 높이,폭,좌우여백을 지정할 수 있음
<marquee direction=right,left> : 문자열의 스크롤 방향 지정
<marquee bgcolor="#000080"> : 배경색 지정
<marquee scrolldelay=5 scrollamount=50> : 속도지정

 

 

아래는 실습용으로 몇개의 예제를 게시하였습니다. 

소스코드를 그대로 복사하여 연습용파일에 붙여넣기한뒤 htm파일로 저장하여 결과물을 직접 실습해보세요. 

메모장에서는 저장, htm파일에서는 새로고침을 하여 그때그때 결과물을 확인해 보세요.

 

 

 

검정색 바탕에 빨간글씨가 지나가게 만들기

<marquee bgcolor="black"><font color="red">배경은 검정색</font></marquee>

 

배경은 검정색

 

 

크기를 지정한 노랑색 바탕에 검정글씨가 지나가게 만들기

<marquee width=400 height=50 bgcolor="yellow"><font size="6">가로 400픽셀 세로 50픽셀에 바탕 노랑, 폰트 사이즈는 6</font></marquee>

 

가로 400픽셀 세로 50픽셀에 바탕 노랑, 폰트 사이즈는 6

 

 

- 참조하기 font 태그 배우기 클릭 https://itfix.tistory.com/28

 

 

좌우로 움직이는 글씨 만들기

<marquee behavior=alternate bgcolor="#ff0080" width=50% height=30><font color="Black">좌우 반복합니다</font></marquee>

 

좌우 반복합니다

 

 

위로 올라가는 글씨 만들기

<marquee direction=up width=180 height=70 bgcolor="yellow"><font color="red">위쪽으로 스크롤 됩니다</font></marquee>

 

위쪽으로 스크롤 됩니다

 

 

지나가는 속도 조절하기

<marquee scrollamount="16">한번에 16픽셀씩 움직입니다</marquee>

 

한번에 16픽셀씩 움직입니다

 

 

위의 설명들을 참조하시어 다양한 예제들을 스스로 만들어 실습해보세요. 아주 재미있는 태그입니다.

수고하셨습니다.