H5制作跑马灯

最新推荐文章于 2023-05-07 08:02:54 发布

weixin_34405354

最新推荐文章于 2023-05-07 08:02:54 发布

阅读量3.2k

点赞数 1

原文链接：https://juejin.im/post/5c258f07f265da614a3a8fe5

版权

本文介绍了两种在H5中制作跑马灯效果的方法：一是利用marquee标签，详细讲解了其格式、属性、hspace/vspace属性以及事件；二是通过CSS3的animation属性来实现。尽管marquee标签非W3C推荐，但浏览器支持良好。

摘要由CSDN通过智能技术生成

marquee标签其实就是一个用于制作跑马灯的标签

<marquee>内容</marquee>

marquee标签的属性主要有behavior、bgcolor、direction、width、height、hspace、vspace、loop、scrollamount、scrolldelay等，它们都是可选的

width和height属性的作用决定滚动文字在页面中的矩形范围大小宽高，属性值可以为数字或百分比

<marquee width="300" height="100%">`跑马灯内容</marquee>
复制代码

这两个属性决定滚动矩形区域跟周围空白区域的距离

<marquee width="300" height="30" vspace="10" hspace="10">跑马灯内容</marquee>
复制代码

设定marquee标签内容的对齐方式

属性值	描述
absbottom	绝对底部对齐
absmiddle	绝对中央对齐

关注