<marquee></marquee>标签可实现文字滚动效果
如:
<marquee><font size=+3 color=red>Hello, World</font></marquee>
可实现文字从右向左滚动的效果
<marquee></marquee>标签常用两个鼠标事件:
onMouseOut="this.start()" :用来设置鼠标移出该区域时继续滚动 onMouseOver="this.stop()":用来设置鼠标移入该区域时停止滚动
如:
<marquee onMouseOut="this.start()" onMouseOver="this.stop()">
onMouseOut="this.start()" :当鼠标移出该区域时继续滚动 onMouseOver="this.stop()":当鼠标移入该区域时停止滚动
</marquee>
属性
1、align属性值
align 表示元素的水平对齐方式,值可以是
absbottom:绝对底部对齐(与g、p等字母的最下端对齐),
absmiddle:绝对中央对齐,
baseline:底线对齐,
bottom:底部对齐(默认),
left:左对齐,
middle:中间对齐,
right:右对齐,
texttop:顶线对齐,
top:顶部对齐
valign属性值
valign 表示元素的垂直对齐方式,值可以是top,middle,bottom,默认为middle
如:
<marquee align="absbottom">align属性值 </marquee>
2、behavior属性值
behavior 表示滚动的方式,值可以是
scroll(连续滚动)
slide(滑动一次)
alternate(来回滚动)
如:<marquee behavior="#">behavior属值</marquee>
3、bgcolor 属性值
bgcolor 表示运动区域的背景色,值是16进制、RGB颜色,默认为白色
RGB颜色值 输入不限制格式,只要包含3个合格的整数即可。例如:rgb(255, 0, 0)、255,0,255、254,234,0、255 0 255
如:<marquee bgcolor="aaaaee">小A博客导航</marquee>
4、direction属性值
direction 表示滚动的方向,值可以是left,right,up,down,默认为left
如:<marquee direction="#">direction属性值</marquee>
5、height、width属性值
height、width 表示运动区域的高度和宽度,值是正整数(单位是像素)或百分数,默认width=100% height为标签内元素的高度
6、hspace、vspace属性值
hspace、vspace 表示元素到区域边界的水平距离和垂直距离,值是正整数,单位是像素。
如:<marquee vspace="100" hspace="100" bgcolor="#CCCCCC">hspace、vspace属性值</marquee>
7、loop属性值
loop 表示循环的次数,值是正整数,默认为无限循环(等于-1也表示无限循环)
<marquee loop="#" behavior="scroll">loop属性值</marquee>
8、scrollamount属性值
scrollamount 表示运动速度,值是正整数,默认为6
如:<marquee scrollamount="20">scrollamount属性值</marquee>
9、scrolldelay属性值
scrolldelay 表示停顿时间,值是正整数,默认为0,单位是毫秒
如: <marquee scrolldelay="500" scrollamount="100">scrolldelay属性值</marquee>
多条文字循环滚动
<marquee direction="up" height="25" scrollamount="2" onMouseOut="this.start()" onMouseOver="this.stop()"> <table width="100%" border="0" cellpadding="2" cellspacing="0"> <tr> <td align="center"> <table width="100%" border="0" cellpadding="2" cellspacing="0"> <tr> <td align="center"> <font color="#FFFFF"> <a href="#" target="_blank">这是第1行数据</a><br> <a href="#" target="_blank">这是第2行数据</a><br> <a href="#" target="_blank">这是第3行数据</a><br> <a href="#" target="_blank">这是第4行数据</a><br> <a href="#" target="_blank">这是第5行数据</a> </font> </td> </tr> </table> </td> </tr> </table> </marquee>
原文:https://www.cnblogs.com/zj68/p/12708647.html