0

0

HTML代码制作滚动文字

不言

不言

发布时间:2018-05-07 16:13:01

|

6556人浏览过

|

来源于php中文网

原创

这篇文章主要介绍了关于html代码制作滚动文字,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下

本节笔者讲述HTML代码中比较特殊的标签,它能使网页中的文字滚动,并且可以控制其滚动的属性。             

 制作滚动文字 通过本章前面的学习,读者已经能够很好地控制各种段落文字的显示方式,不过无论怎么设置,文字都是静态的。

本节笔者讲述HTML代码中比较特殊的标签,它能使网页中的文字滚动,并且可以控制其滚动的属性。              

制作滚动文字
通过本章前面的学习,读者已经能够很好地控制各种段落文字的显示方式,不过无论怎么设置,文字都是静态的。本节笔者讲述HTML代码中比较特殊的标签,它能使网页中的文字滚动,并且可以控制其滚动的属性。
4.3.1 设置文字滚动
HTML技术中使文字滚动的方法是使用双标签。在HTML代码中可使其作用区文字滚动,默认为从右到左,循环滚动。在D:\web\目录下创建网页文件,命名为mar.htm,编写代码如代码4.15所示。
代码4.15 文字滚动的设置:mar.htm



 文字滚动的设置



文字滚动示例(默认):做人要厚道


在浏览器地址栏输入http://localhost/mar.htm,浏览效果如图4.15所示。

图4.15 设置文字滚动默认形式
从图4.15可得,在未设置宽度时,标签是独占一行的。
4.3.2 设置文字滚动的方向
标签的direction属性用于设置内容滚动方向,属性值有left、right、up、down,分别代表向左、向右、向上、向下,例如以下代码:
做人要厚道
做人要厚道
做人要厚道
做人要厚道
4.3.3 设置文字滚动的速度和形式
设置文字滚动使用标签,其属性说明如下。
标签的scrollamount属性用于设置内容滚动速度。
标签的behavior 属性用于设置内容滚动方式,默认为scroll,即循环滚动,当其值为alternate时,内容将来回循环滚动。当其值为slide时,内容滚动一次即停止,不会循环。还有一个loop属性可设置其滚动循环次数,默认为没有限制。
标签的scrolldelay属性用于设置内容滚动的时间间隔。
标签的bgcolor属性用于设置内容滚动背景色(类似于body的背景色设置)。
标签的width 属性用于设置内容滚动背景宽度。
标签的height属性用于设置内容滚动背景高度。
修改mar.htm网页文件,编写代码如代码4.16所示。

代码4.16 文字滚动的设置:mar.htm



 文字滚动的设置



文字滚动示例(默认):做人要厚道
文字滚动示例(向右):做人要厚道
文字滚动示例(向下,滚动方式为slide,速度为10):做人要厚道
文字滚动示例(默认方向,滚动方式为alternate,循环3次,速度为2):做人要厚道
文字滚动示例(向上,背景色为#CCFF66,设置了背景宽度和高度):做人要厚道


在浏览器地址栏输入http://localhost/mar.htm,浏览效果如图4.16所示。

图4.16 文字滚动的不同形式
的众多属性能非常方便地制作滚动文字,在后面的JavaScript学习中,读者将继续深化标签的动态行为学习。

相关推荐:

简单原生js文字向上滚动消息框代码
简单原生js文字向上滚动消息框代码

一款简单原生js文字向上滚动消息框代码

下载

立即学习前端免费学习笔记(深入)”;

HTML代码实现简易购物车

相关文章

HTML速学教程(入门课程)
HTML速学教程(入门课程)

HTML怎么学习?HTML怎么入门?HTML在哪学?HTML怎么学才快?不用担心,这里为大家提供了HTML速学教程(入门课程),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
高德地图升级方法汇总
高德地图升级方法汇总

本专题整合了高德地图升级相关教程,阅读专题下面的文章了解更多详细内容。

42

2026.01.16

全民K歌得高分教程大全
全民K歌得高分教程大全

本专题整合了全民K歌得高分技巧汇总,阅读专题下面的文章了解更多详细内容。

75

2026.01.16

C++ 单元测试与代码质量保障
C++ 单元测试与代码质量保障

本专题系统讲解 C++ 在单元测试与代码质量保障方面的实战方法,包括测试驱动开发理念、Google Test/Google Mock 的使用、测试用例设计、边界条件验证、持续集成中的自动化测试流程,以及常见代码质量问题的发现与修复。通过工程化示例,帮助开发者建立 可测试、可维护、高质量的 C++ 项目体系。

24

2026.01.16

java数据库连接教程大全
java数据库连接教程大全

本专题整合了java数据库连接相关教程,阅读专题下面的文章了解更多详细内容。

35

2026.01.15

Java音频处理教程汇总
Java音频处理教程汇总

本专题整合了java音频处理教程大全,阅读专题下面的文章了解更多详细内容。

16

2026.01.15

windows查看wifi密码教程大全
windows查看wifi密码教程大全

本专题整合了windows查看wifi密码教程大全,阅读专题下面的文章了解更多详细内容。

56

2026.01.15

浏览器缓存清理方法汇总
浏览器缓存清理方法汇总

本专题整合了浏览器缓存清理教程汇总,阅读专题下面的文章了解更多详细内容。

16

2026.01.15

ps图片相关教程汇总
ps图片相关教程汇总

本专题整合了ps图片设置相关教程合集,阅读专题下面的文章了解更多详细内容。

9

2026.01.15

ppt一键生成相关合集
ppt一键生成相关合集

本专题整合了ppt一键生成相关教程汇总,阅读专题下面的的文章了解更多详细内容。

26

2026.01.15

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Bootstrap 5教程
Bootstrap 5教程

共46课时 | 2.9万人学习

AngularJS教程
AngularJS教程

共24课时 | 2.7万人学习

CSS教程
CSS教程

共754课时 | 19.8万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号