移动的字体和图片.pptVIP

第10章 移动的字体和图片(初级) 不管是新闻网站还是电子商务网站，对及时新闻的显示或广告的滚动播出，都会用到移动显示。所谓的移动就是让对象动起来，对象包括文字和图片。移动属性语法用marquee表示，是双标记对，标记对里面放置的是将要移动的对象，可以是图片或文本等，所以中间放的就是将要移动的对象。 学习本章，将会了解以下内容： 移动属性的基本语法 文字的移动 图片的移动 如何设置对象移动 移动实例手把手 10.1 移动属性基本语法 在网页中，可以让文字或图片在指定的区域动起来，看到的动可以是由上到下或者由下到上，还可以左右移动，也可以设置移动多少次。这些效果往往在商城中对卖得很火的产品设置移动，或有的公告也可以移动，本节来分析和讲解这样的效果。 移动属性是双标记的，其语法用marquee标签对表示，里面放的内容就是要移动的对象，完整语法如下： marquee 将要移动的文字或图片对象 /marquee 属性marquee默认的是向左循环移动，对象移动是在其所在的父对象的有效区域内，代码10.1表示属性基本语法用法。 10.2 文字的移动 由10.1节可以知道，文字的移动就是在属性marquee标签对文字进行操作，不过在本小节中除了要用到上一节中介绍的语法外，还要对本行的文字设置不同的移动方向。在实际应用中并非按默认向左移动，可能需要不同的方向移动才能表达出效果，这样就可以控制对象移动方向，本节来介绍文字对象的移动方向。 移动属性中设置移动的方向是在移动属性marquee中，再来设置对象移动的方向，其语法用direction表示，可接left表示向左，也是默认值，还可以接right，表示向右移动，完整语法如下： marquee direction=# 在属性marquee中，设置方向值direction，其中#可以选择是left和right的一种，表示对象向左还是向右移动，当不设置direction值时，系统默认向左，与设置direction值为left是一样的效果，代码10.2中，一行文字表示向左移动，另一行文字表示向右移动。 10.3 图片的移动 现在的商城为了展示商品，都将商品图片通过移动来表现出效果，把所有的商品图片放到marquee中，然后通过处理使图片移动，达到在很小的空间可以展示更多的内容，而且加强了用户的体验感。 下面代码表示一张图片在标记marquee中移动，而且设置了对象的宽为600像素，高为200像素，背景颜色为#666666，如代码10.3所示。 代码10.3 源代码\第10章\图片的移动.html html head title图片的移动/title /head body !--设置移动区域大小-- marquee width=600px height=200px bgcolor=#666666 img src=仙境.gif图片的大小在marquee中移动 /marquee /body /html 10.4 如何设置对象移动 如何设置对象的移动，当引入marquee后，如按默认值表现来的效果并不是当初想要的，还需要进行设置，如移动的方向，区域的大小，是否循环移动等都在标记marquee中设置。 下面从移动方向、移动方式、移动速度、延时和宽度与高度来介绍标记的设置，从上面的实例中可以知道，默认的移动方面是从右向左，而在标记中可以设置从左向右或从上到下等方向移动。 10.4.1 文本移动的方向 移动的方向用参数direction表示，direction的英文意思就是方向。这个参数的取值有四个：left（左）、right（右）、up（上）、down（下）。通过设置方向值就可以设置对象往哪个方向移动了，代码如下： marquee direction=up向上移动/marquee 代码表示文本“向上移动”从下往上移动，而且是一次又一次不停地移动着。 10.4.2 文本的滚动循环 如果想设置对象移动的方式，比如是滚动循环，语法用behavior表示，其后可选择参数为：scroll（循环移动）、slide（只移动一个回合）、alternate（来回移动），如下面代码表示来回移动。 marquee direction=left behavior=alternate哈哈，我来回走！/marquee 代码设置了文本来回移动，还可以设置文本在marquee标记中循环的次数，设置循环用loop，其后可接上具体数值表示循环的次数，如下表示设置了只循环三次。 marquee loop=3我只走三次哦/marquee 10.4.3 文本的移动速度 还可以用scrollamount再设置移动的速度，可以设置很快也可以设置很慢，通过数值来设置，值取正整数。数值越大，速度越快，如下代码表示文本在标记中移动的速度。 ma