HTML+CSS教程(三)marquee滚动效果

一.marquee

1.marquee标签的属性
scrollHeight:获取对象的滚动高度。
scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离。
scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离。
scrollWidth:获取对象的滚动宽度。
offsetHeight:获取对象相对于版面或由父坐标offsetParent属性指定的父坐标的高度。
offsetLeft:获取对象相对于版面或由offsetParent属性指定的父坐标的计算左侧位置。
offsetTop:获取对象相对于版面或由offsetParent属性指定的父坐标的计算顶端位置。
offsetWidth:获取对象相对于版面或由父坐标offsetParent属性指定的父坐标的宽度。
innerHTML:设置或获取位于对象起始和结束标签内的HTML
align:设置对齐方式(left左对齐;right右对齐;center居中对齐;justify两端对齐)
behavior
设置滚动的方式(alternate表示在两端之间来回滚动;scroll表示由一端滚动到另一端,会重复;slide表示由一端滚动到另一端,不会重复。)
bgcolor设置滚动的背景颜色。
direction:表示滚动的方向,值left、right、up、down,默认left
height:设置滚动区域的高
width:设置滚动区域的宽
scrollamount:表示运动速度,值是正整数,默认为6
scrolldelay:表示停顿时间,值是正整数,默认为0
οnmοuseοut=“this.start()” :用来设置鼠标移出该区域时继续滚动
οnmοuseοver=“this.stop()” :用来设置鼠标移入该区域时停止滚动
:<marquee></marquee>中间的内容可以为文字、图片、,也可以是由程序员生成的文字或图片。
例:

<marquee align="left" behavior="scroll" bgcolor="red" direction="up" width="300" height="200" hspace="50" vspace="20" scrollamount="10" scrolldelay="100"   onmouseout="this.start()" onmouseover="this.stop()">
滚动的文字
程序代码
<img src="img/01.jpg"/>
</marquee>

二.

hspace:设置图像周围的空间 ,以像素为单位,指定图像左边和右边的文字与图像之间的距离。
vspace:设置上面的下面的文字与图像之间的距离的像素数。

  1. 通常图形浏览器不会在图像和其周围的文字之间留出很多的空间。除非创建一个透明的图像边框来扩大这些间距。否则图像与其周围的文字之间默认两个像素的距离,对于大多数设计者来说太近了。如果把图像放在超链接中,特殊颜色的边框会把你费尽心思留出的所有间距都占据了,而且还会使人们注意到文字与图像是多么接近。hspace和vspace属性可以给图像一个自由呼吸的空间。
  2. 浏览器支持
    虽然不赞成使用align,但几乎所有的浏览器都支持
  3. 提示和注释
    提示:可以在外部样式表中使用css的外边距属性内边距属性,为站点上的所有图像这种一致的边距。与单独为一个图像设置hspace和vspace属性相比,这种方式无疑拥有更高的效率。
    兼容性注释:不推荐使用img元素的hspace和vspace属性;在HTML4.01 strict以及XHTML1.0 strict DTD中,不支持img的hspace和vspace属性,请使用css代替。
  • 2
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

豆皮没有豆

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值