关于移动的运用[随缘]
发表日期：2009年4月4日 出处：网络 作者：随缘 本页面已被访问 4109 次
HTML语言基础
关于移动的运用
整理编写：随缘
前面我们学习了边框的制作和图片网页的制作，但是仅仅有这些还不能很好的展示作者心中所想表达的意境，有时我们还需让文字及图片动起来，以丰富你作品的内涵，插入适当的移动效果会让你的作品更加锦上添花。这就接触到移动的运用了，下面我们就讲讲移动的基本语法。首先我们先看看移动的几种展示效果：
1.从上往下的移动：
代码：<MARQUEE scrollAmount=5 direction=down>
<CENTER><STRONG><FONT color=#ff4500><FONT face=华文行楷 size=5>我从上向下移</FONT><BR></FONT></STRONG><IMG height=400 src="
http://image27.360doc.com/DownloadImg/2011/04/2521/11222553_1.jpg" width=350></CENTER></MARQUEE>
2.左右来回的移动：
代码：<MARQUEE behavior=alternate><FONT color=#ff8c00 size=5><STRONG>
左右来回移动</STRONG></FONT><BR><IMG height=300 src="
http://photo6.fotolog.net.cn/userimages/48/36/j/jz99131251/52/500_H70KKLMc.gif" width=200></MARQUEE>
3.中间向两边跑的移动：
往外移动 动移外往
代码：<P align=center>
<MARQUEE width=200 height=50><FONT style="FONT-SIZE: 30pt;
FILTER: shadow(color=ff8c00); COLOR: #ff1493; LINE-HEIGHT:
150%; FONT-FAMILY: 华文彩云"><STRONG>往外移动
</STRONG></FONT></MARQUEE>
<MARQUEE direction=right width=200 height=50><FONT style=
"FONT-SIZE: 30pt; FILTER: shadow(color=ff8c00); COLOR:
#ff1493; LINE-HEIGHT: 150%; FONT-FAMILY: 华文彩云"><STRONG>
动移外往</STRONG></FONT></MARQUEE></P>
相信朋友们都看到效果了吧,现在我们就来讲讲是什么实现了这些运动
的效果。首先，我们来认识一下移动的一些属性及参数：
MARQUEE 移动的起始代码，令文字、图片移动。
<P align=center> 表示居中
direction= “一个参数”，移动方向 : 参数有：left（左)、right(右)、
up(上)、down(下)
scrollamount=5 移动的速度。给的数值越大速度越快，可根据自己的需
要来设置。
font 文字的字体。
width 表示为宽度。放在不同的地方表示不同的作用。如是文字表示文字
的展示宽度；如是图片则表示为图片的宽度；如是flash则表示为flash的
宽度。
height 表示为高度。其作用和宽度一样。
img src= 图片起始符。等号后面加入图片的绝对地址。
loop=3 表示移动的次数，等号后面的数值根据需要自己设置。
bgcolor 表示为背景色，如（bgcolor=pink）
pink 是背景颜色
behavior 移动方式。
参数有：
scroll(循环移动)
slide(只移动一个回合)
alternate(来回移动)
scrolldelay = 100 表示延时，单位为毫秒，数值越大，停顿时间就越长。
在平时的运用中还有很多方法，在这儿就不一一列出了，移动
不仅仅用于文字、图片，还可用于边框，朋友们可自己试试，你将会有
惊奇的发现，动动手吧。 下面为大家提供一些经常可用的移动代码，大家可以复制粘贴到你
的编辑后台去用。具体插入的地方可根据大家的喜欢和需要去插入。但
一定要记住的是：必须插入在你网页的文字展示区域里。也就是说插在
所有边框代码最后<TD>代码的后面。这样就不会出现错码和乱码。
一、图片和文字移动的效果： 效果（一）
欣赏移动文字图片
效果（一）的代码：
<CENTER>
<TABLE borderColor=fff000 height=350 cellSpacing=1 cellPadd
ing=10 width=250 border=3><TBODY><TR><TD bgColor=#000000>
<MARQUEE scrollAmount=3 direction=down behavior=alternate
>">
</MARQUEE></MARQUEE>
</TD></TR></TBODY></TABLE>
效果（二）
朋友你好， 海之韵欢迎你！
效果（二）的代码：
<CENTER>
<TABLE borderColor=#cccccc cellSpacing=5 cellPadding=5 width=500
align=center background="
http://olq.rqsha.com/明星/1.jpg"
border=5>
<TBODY>
<TR>
<TD>
<MARQUEE scrollAmount=2 direction=up width=400 height=230>
<CENTER><FONT size=5 color=#003399 face="隶书"><br>朋友你好，
海之韵欢迎你！</br></FONT></MARQUEE> </TD></TR></TBODY></TABLE>
</CENTER>
效果（三） 海洋之心欢迎你海洋之心欢迎你 效果（三）的代码：
双排字上下向中间移动
<P align=center><FONT style="FONT-SIZE: 30pt; WIDTH: 100%; COLOR:
red; LINE-HEIGHT: 150%; FONT-FAMILY: 华文行楷"><B><EM>
海之韵欢迎你</EM></B></FONT><FONT style="FONT-SIZE: 30pt; FILTER:
FlipV; WIDTH: 100%; COLOR: ff99ff; LINE-HEIGHT:
150%; FONT-FAMILY: 华文行楷"><B><EM>海之韵欢迎你</EM></B></FONT></P>
效果（四） 你的家园---海之韵 效果（四）的代码：
字体从右向左移动
<DIV align=center>
<MARQUEE style="WIDTH: 600px; HEIGHT: 48px" width=363 height=48>
<EM><FONT face=楷体_GB2312 color= red size=7><STRONG>
你的家园---海之韵</STRONG></FONT></EM></MARQUEE></DIV>
<DIV align=center> </DIV>
效果（五） 相约海之韵 效果（五）的代码：
<CENTER>
<MARQUEE scrollAmount=1 direction=up height=50>
<CENTER><FONT style="FONT-SIZE: 25pt; FILTER: shadow(color=
#FF8C00); WIDTH:360px; COLOR: white; LINE-HEIGHT: 150%; FONT-FAMILY:
华文彩云"><B>相约海之韵</
效果（六）
欢 迎 光 临 效果（六）的代码：
字体在图案中
<P><FONT style="FONT-SIZE: 25pt; FILTER: glow(color:0000CC 22DD22,strength=50); WIDTH: 100%; COLOR: white; LINE-HEIGHT:
350%; FONT-FAMILY: 华文彩云; HEIGHT: 151px">
欢
迎 光 临 </FONT></P>
海洋之心素材站
http://xiaofan118.16789.net/海之韵音画网
http://www.52hzy.net/请点击这里跟我学制作
