마퀴 (marquee) 태그를 마스터 하자

<b>&lt;marquee&gt; 내 용 &lt;/marquee&gt;</b> - 내용에는 어떤 것이든 들어 올 수 있습니다. 이 예제들은 문자들만 넣어 보겠습니다.</p>

<hr size="1">
<p><b>1.</b> 기본 문법

<p>예제 : &lt;marquee&gt;ㅋㅋㅋㅋ&lt;/marquee&gt;<br>
<marquee>ㅋㅋㅋㅋ</marquee></p>

<hr size="1">
<p><b>2.</b> 이동하는 방향을 바꾸어 보자. 

<b><span style="background-color:rgb(255,255,204);">direction</span></b> 속성을 이용하여 바꾸며, up , down , left , right 의 값을 줄 수 있다.</p>

<table class="fon1" align="center" border="0" cellpadding="2" cellspacing="0" width="100%">
<tr>
<td>
<p>예제 : &lt;marquee <span style="background-color:rgb(255,255,204);">direction=&quot;right&quot;</span>&gt;ㅋㅋㅋㅋ&lt;/marquee&gt;<br>
<marquee direction="right">ㅋㅋㅋㅋ</marquee></p>
</td>
<td>
<p>예제 : &lt;marquee <span style="background-color:rgb(255,255,204);">direction=&quot;left&quot;</span>&gt;ㅋㅋㅋㅋ&lt;/marquee&gt;<br>
<marquee direction="left">ㅋㅋㅋㅋ</marquee></p>
</td>
</tr>

<tr>
<td>
<p>예제 : &lt;marquee <span style="background-color:rgb(255,255,204);">direction=&quot;up&quot;</span>&gt;ㅋㅋㅋㅋ&lt;/marquee&gt;<br>
<marquee direction="up">ㅋㅋㅋㅋ</marquee></p>
</td>
<td>
<p>예제 : &lt;marquee <span style="background-color:rgb(255,255,204);">direction=&quot;down&quot;</span>&gt;ㅋㅋㅋㅋ&lt;/marquee&gt;<br>
<marquee direction="down">ㅋㅋㅋㅋ</marquee></p>
</td>
</tr>
</table>

<hr size="1">
<p><b>3.</b> 한번에 이동하는 거리 설정하기로 

<b><span style="background-color:rgb(255,255,204);">scrollamount</span></b> 속성을 이용하며 수치는 숫자로 줍니다.</p>

<p>예제 : &lt;marquee <span style="background-color:rgb(255,255,204);">scrollamount=&quot;1&quot;</span>&gt;ㅋㅋㅋㅋ&lt;/marquee&gt;<br>
<marquee scrollamount="1">ㅋㅋㅋㅋ</marquee></p>

<p>예제 : &lt;marquee <span style="background-color:rgb(255,255,204);">scrollamount=&quot;5&quot;</span>&gt;ㅋㅋㅋㅋ&lt;/marquee&gt;<br>
<marquee scrollamount="5">ㅋㅋㅋㅋ</marquee></p>

<p>예제 : &lt;marquee <span style="background-color:rgb(255,255,204);">scrollamount=&quot;10&quot;</span>&gt;ㅋㅋㅋㅋ&lt;/marquee&gt;<br>
<marquee scrollamount="10">ㅋㅋㅋㅋ</marquee></p>

<hr size="1">
<p><b>4.</b> 스크롤되는 시간 간격 설정하기. 

<b><span style="background-color:rgb(255,255,204);">scrolldelay</span></b> 속성을 이용하며 역시 수치는 숫자로 줍니다.<br>
&nbsp;&nbsp;&nbsp;&nbsp;1000은 1초 입니다. 1000 이라고 주면 1초에 한번씩 움직입니다.</p>

<p>예제 : &lt;marquee <span style="background-color:rgb(255,255,204);">scrolldelay=&quot;100&quot;</span>&gt;ㅋㅋㅋㅋ&lt;/marquee&gt;<br>
<marquee scrolldelay="100">ㅋㅋㅋㅋ</marquee></p>

<p>예제 : &lt;marquee <span style="background-color:rgb(255,255,204);">scrolldelay=&quot;500&quot;</span>&gt;ㅋㅋㅋㅋ&lt;/marquee&gt;<br>
<marquee scrolldelay="500">ㅋㅋㅋㅋ</marquee></p>

<p>&nbsp;예제 : &lt;marquee <span style="background-color:rgb(255,255,204);">scrolldelay=&quot;1000&quot;</span>&gt;ㅋㅋㅋㅋ&lt;/marquee&gt;<br>
<marquee scrolldelay="1000">ㅋㅋㅋㅋ</marquee></p>

<hr size="1">
<p><b>5.</b> 스크롤 컨트롤 - 좌우로 왕복하는 속성입니다. ^^ 

<b><span style="background-color:rgb(255,255,204);">behavior=alternate</span></b></p>

<p>예제 : &lt;marquee <span style="background-color:rgb(255,255,204);">behavior=&quot;alternate&quot;</span>&gt;ㅋㅋㅋㅋ&lt;/marquee&gt;<br>
<marquee behavior="alternate">ㅋㅋㅋㅋ</marquee></p>

<p>예제 : &lt;marquee <span style="background-color:rgb(255,255,204);">behavior=&quot;alternate&quot; direction=&quot;up&quot;</span>&gt;ㅋㅋㅋㅋ&lt;/marquee&gt;<br>
<marquee behavior="alternate" direction="up">ㅋㅋㅋㅋ</marquee></p>

<hr size="1">
<p><b>6.</b> 기타 속성들<br>
&nbsp;&nbsp;* 

<b>width</b> 와 

<b>height</b> 로 크기를 조절할 수 있습니다</p>

<p>예제 : &lt;marquee <span style="background-color:rgb(255,255,204);">width=&quot;100&quot;</span>&gt;ㅋㅋㅋㅋ&lt;/marquee&gt;<br>
<marquee width="100">ㅋㅋㅋㅋ</marquee></p>

<p>예제 : &lt;marquee <span style="background-color:rgb(255,255,204);">height=&quot;20&quot; direction=&quot;down&quot;</span>&gt;ㅋㅋㅋㅋ&lt;/marquee&gt;<br>
<marquee height="20" direction="down">ㅋㅋㅋㅋ</marquee></p>

<p>&nbsp;&nbsp;* 

<b>loop</b> 속성으로 반복횟수를 지정합니다. 기본값은 무한 반복 입니다. 무한 반복은 

<b>infinite</b> 로 값을 주면됩니다.<br>
&nbsp;&nbsp;&nbsp;&nbsp;하지만 기본적으로 무한 반복이기 때문에 굳이 설정할 필요는 없어요.</p>

<p>예제 : &lt;marquee <span style="background-color:rgb(255,255,204);">loop=&quot;10&quot;</span>&gt;ㅋㅋㅋㅋ&lt;/marquee&gt;<br>
<marquee loop="10">ㅋㅋㅋㅋ</marquee></p>

<hr size="1">
<p><b>7.</b> 응용 - 마퀴의 꽃은 응용입니다. ^^</p>

<p>예: &lt;marquee <span style="background-color:rgb(255,255,204);">behavior=&quot;alternate&quot;</span> <span style="background-color:rgb(255,255,204);">direction=&quot;up&quot;</span>&gt;&lt;marquee <span style="background-color:rgb(255,255,204);">behavior=&quot;alternate&quot;</span>&gt;●&lt;/marquee&gt;&lt;/marquee&gt;<br>
&nbsp;&nbsp;&nbsp;두개의 마퀴태그를 중복사용 하여 통통튕기는 효과를 연출!<br>
<marquee behavior="alternate" direction="up"><marquee behavior="alternate">●</marquee></marquee></p>

<hr size="1">
<p>마치며.. 음 너무 금방 끝나는 군요. 이것 저것 사용하여 많이 응용해 보세요!<br>
마퀴태그 사이에는 그림, 표, 문자 등 모든것이 들어갑니다~ 그럼 멋진 태그 만드세요 ^^