分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 教程案例

html跑马灯/走马灯效果

发布时间:2023-09-06 01:43责任编辑:郭大石关键词:暂无标签

实现跑马灯的方法很多,其中最简单的是采用一句Html代码来实现,我们在需要出现跑马灯效果的地方插入“<marquee>滚动的文字</marquee>”语句,它的效果如下所示:

参数用法介绍
behavior=scroll, slide, alternate跑马方式:循环绕行,只跑一次就停住,来回往复运动
direction=left,right跑马方向:从左向右,从右向左
loop=100跑马次数:循环100次,如不写默认为一直循环
width=100%,height=200跑马范围:宽为100%,高为200像素
scrollamount=20跑马速度:数越大越快
scrolldelay=500跑马延时:毫秒数,利用它可实现跃进式滚动
hspace=20,vspace=20跑马区域与其它区域间的空白大小
bgcolor=#00FFCC跑马区域的背景颜色
face=楷体_GB2312跑马灯文字字体
color=#ff0000跑马灯文字颜色
size=3跑马灯文字字号
STRONG跑马灯文字加粗

  你已经看到,尽管<marquee>参数不少,但毕竟不能实现复杂的和自定义的特殊跑马灯效果,而且还有浏览器限制,所以我们更多情况下会采用JavaScript来实现跑马灯。

html跑马灯/走马灯效果

原文地址:https://www.cnblogs.com/huanyumingmei/p/8467915.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved