多行数据滚动显示_marquee

<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