本文摘自PHP中文网,作者黄舟,侵删。
接下来介绍一下marquee标签marquee标签是实现文字轮滚的大功臣
常用属性如下:
directory 指明轮滚方向(默认向左)
behavior 指明轮滚方式(默认是scroll)
Hspace 指明元素到区域的水平距离
Vspace 指明元素到区域的垂直距离
loop 指明循环次数(默认-1表示无限循环)
下面是我做的一个小栗子,大家可以试一试哦
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | < html >
< head >
< title > 文字轮滚</ title >
< meta charset = "utf-8" >
</ head >
< body >
< p align = center >< marquee Hspace = 6 scrollamount = 3 width = 200 height = 40 bgcolor = red scrolldelay = 1 behavior = "scroll" directory = "right" >我是Cabby****人送外号白菜姐</ marquee ></ p >
< p align = center >< marquee Hspace = 6 scrollamount = 5 width = 200 height = 40 bgcolor = yellow scrolldelay = 0 behavior = alternate >啦啦啦啦啦啦啦</ marquee ></ p >
< p align = center >< marquee Hspace = 6 scrollamount = 3 width = 200 height = 40 bgcolor = red scrolldelay = 1 behavior = "scroll" directory = "right" loop=-1>我是Cabby****人送外号白菜姐</ marquee ></ p >
< p align = center >< marquee Hspace = 6 scrollamount = 5 width = 200 height = 40 bgcolor = yellow scrolldelay = 0 behavior = alternate loop=-1>啦啦啦啦啦啦啦</ marquee ></ p >
< p align = center >< marquee Hspace = 6 scrollamount = 3 width = 200 height = 40 bgcolor = red scrolldelay = 1 behavior = "scroll" directory = "right" >我是Cabby****人送外号白菜姐</ marquee ></ p >
</ body >
</ html >
|
以上就是html5实现文字轮滚的示例代码的详细内容,更多文章请关注木庄网络博客!
相关阅读 >>
HTML5实现二维码扫描并解析
什么是应用程序缓存(application cache)?
HTML5百叶窗效果的示例代码_HTML5教程技巧
HTML5使用dom进行自定义控制
css的工作过程介绍(图文)
详解HTML5实现微信拍摄上传照片的功能
怎样开发优秀的HTML5游戏-迪斯尼《寻找奥兹之路》游戏技术详解(二)
HTML5实践-详细介绍css3中的几个属性text-shadow、box-shadow和border-radius
h5实现多图片预览上传及点击可拖拽控件
HTML5游戏《坦克后援队》的示例代码分享
更多相关阅读请进入《HTML5》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » html5实现文字轮滚的示例代码