天天看点

HTML-marquee标签学习

marquee标签是个容器标签,是微软对HTML的扩展。并且只支持MSIE3以后内核,所以如果你使用非IE内核浏览器(如:Netscape)可能无法一些很有意思的效果。

项目里有个实现在线用户列表滚动的功能,用了一下marquee,总结一下它的属性参数.

[code] <marquee width="100%" height="35" direction="left" behavior="alternate" scrollamount="2" scrolldelay="60" οnmοuseοver=stop() οnmοuseοut=start()>

<c:forEach items="${model}" var="user">

<a href="${rootUrl}index/userInfo.do?id=${user.id}" target="_blank" rel="external nofollow" >

<img src="${rootUrl}images/left/user.gif"/>${user.name}[${user.trueName}]</a>

</c:forEach>

</marquee>[/code]

用到了以下属性

[b]1)面积[/b]

[code]<height=# width=#> <marquee height=40 width=50% bgcolor=aaeeaa>面积!</marquee>[/code]

[b]2)方向[/b]

[code]

<direction=#> #=left, right ,up ,down

<marquee direction=left>从右向左移!</marquee>[/code]

[b]3)方式[/b]

[code]

<bihavior=#> #=scroll, slide, alternate

<marquee behavior=scroll>一圈一圈绕着走</marquee>

<marquee behavior=slide>只走一次就歇了</marquee>

<marquee behavior=alternate>来回走</marquee>[/code]

[b]4)速度[/b]

[code]

<scrollamount=#> <marquee scrollamount=20>走</marquee>[/code]

[b]5)延时[/b]

[code]

<scrolldelay=#> <marquee scrolldelay=500 scrollamount=100>走一步,停一停</marquee>[/code]

[b]6)鼠标属性[/b]

[code]

onMouseOut=this.start() ........鼠标移出状态滚动

onMouseOver=this.stop() .........鼠标经过时停止滚动[/code]

还有其他属性,尚未用到

[b]7)循环[/b]

[code]

<loop=#> #=次数;若未指定则循环不止(infinite)

<marquee loop=3 width=50% behavior=scroll>只走 3 趟</marquee>

<marquee loop=3 width=50% behavior=slide>只走 3 趟</marquee>

<marquee loop=3 width=50% behavior=alternate>只走 3 趟!</marquee>[/code]

[b]8)外观(Layout)设置[/b]

对齐方式(Align)

[code]

<align=#> #=top, middle, bottom <font size=6>

<marquee align=# width=400>啦啦啦,我会移动耶!</marquee></font>

[/code]

[b]9)底色[/b]

[code]

<bgcolor=#> #=rrggbb 16 进制数码,或者是下列预定义色彩:

Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime,

Fuchsia, White, Green, Purple, Silver, Yellow, Aqua <marquee bgcolor=aaaaee>颜色!</marquee>[/code]

[b]10)空白[/b]

[code]

(Margins)<hspace=# vspace=#>

<marquee hspace=20 vspace=20 width=150 bgcolor=ffaaaa align=middle>面积!</marquee>[/code]