HTML代码制作滚动文字

这篇文章主要介绍了关于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所示。
HTML代码制作滚动文字
图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所示。
HTML代码制作滚动文字
图4.16 文字滚动的不同形式
的众多属性能非常方便地制作滚动文字,在后面的JavaScript学习中,读者将继续深化标签的动态行为学习。

相关推荐:

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

HTML代码实现简易购物车

以上就是HTML代码制作滚动文字的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1546102.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年12月21日 17:50:42
下一篇 2025年12月21日 17:50:48

相关推荐

  • html文件的中文乱码问题与在浏览器中的显示问题

    这篇文章主要介绍了关于html文件的中文乱码问题与在浏览器中的显示问题,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 我今天的页面也是出现了乱码,所以在网上查找了相关的问题,看来一下,这个方法挺不错的,我也试验了呢,我用的editp编辑器,在文档—文件编码—更改文件编码—选择自己所需…

    2025年12月21日 好文分享
    000
  • HTML实现页面自动跳转的五种方法

    这篇文章主要介绍了关于html实现页面自动跳转的五种方法,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 在上篇文章给大家介绍了HTML页面3秒后自动跳转的三种常见方法,本文继续给大家介绍有关html页面跳转相关知识,一起学习吧。下面列了五个例子来详细说明,这几个例子的主要功能是:在5…

    好文分享 2025年12月21日
    000
  • html标签分类

    将  HTML 元素按功能进行分组。先简单会汇总下,熟悉的放前面。 根元素: 文档元数据:、、、内容分区:、、 、 、 、~ 、 、、 文本内容:、、、、、 、、 、、、 、、 、内联文本语义:、、、、、、、、、、、、、、、、、、、、、、、、、、、、、图片和多媒体:@@##@@ 内嵌内容:、@@@#…

    好文分享 2025年12月21日
    000
  • HTML基础之选择器

    这篇文章介绍的内容是关于HTML基础之选择器 ,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 选择器的作用 可以在样式表里更加方便快捷的对html的各种样式以及属性进行操作 分类 1、标签类型选择器:对标签设置样式 a{ text-decoration: none;} 2、包含选择符…

    好文分享 2025年12月21日
    000
  • Html实现歌曲歌词同步

    这篇文章主要介绍了关于Html实现歌曲歌词同步,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 歌词同步 body { background:url(“Img/起风了.jpg”) center no-repeat ; background-size:60% 100%; } * { ma…

    好文分享 2025年12月21日
    000
  • HTML 文本格式化

    这篇文章主要介绍了关于HTML 文本格式化 ,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 html 文本格式化 自选教程(如约智惠.com)加粗文本斜体文本电脑自动输出这是下标 和 上标 实例 文本格式化 自选教程(如约智惠.com)这个文本是加粗的这个文本是加粗的这个文本字体放大…

    好文分享 2025年12月21日
    000
  • html自适应字号

    这篇文章主要介绍了关于html自适应字号,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 在开发过程中有遇到需要根据界面dom的宽高来设置自适应字号大小,现将开发思路分享 在页面dom元素的宽和高都有限制的情况下,无法为所有的元素设置同样的字号大小,而将字号设置过小又不利于界面美观,所…

    好文分享 2025年12月21日
    000
  • HTML中重要的关键字

    这篇文章主要介绍了关于HTML中重要的关键字 ,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 bgcolor网页颜色background背景图片br 换行hr 水平线id 唯一的名字class 类(同一个国家)font 控制网页文本的显示外观img里面的 alt属性:用来在图片上提示…

    好文分享 2025年12月21日
    000
  • HTML 速查列表

    这篇文章主要介绍了关于HTML 速查列表,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 HTML 基本文档 文档标题 可见文本… 基本标签(Basic Tags) 最大的标题 . . . . . . . . . . . . 最小的标题 这是一个段落。 (换行) (水平线) 文本格…

    2025年12月21日
    000
  • springboot集成html之分页功能实现

    这篇文章主要介绍了关于springboot集成html之分页功能实现 ,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 说不清楚,直接上代码。和展示效果: 前台: 陪米app后台主页 var pageNo = 1;var pageSize = 8;var pages = 0;//&lt…

    2025年12月21日 好文分享
    000
  • HTML页面原生VIDEO标签隐藏下载按钮功能

    这篇文章主要介绍了html页面原生video标签隐藏下载按钮功能,非常不错,具有参考借鉴价值,需要的朋友参考下吧 在写web项目的时候,遇到简介页面有一个单独的简介视频,只有这一个短短的视频所以没有使用任何video组件,所以运用原生video标签就想解决问题。 虽然简介视频是非付费的,但也不希望会…

    2025年12月21日
    000
  • HTML 实现背景图片的替换

    这篇文章介绍的内容是关于HTML  实现背景图片的替换 ,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 @@##@@ var curIndex = 0;var timeInterval = 3000; //切换时间 3秒 可以修改var arr = new Array();arr[0…

    好文分享 2025年12月21日
    000
  • html设置表格边框样式

    这篇文章介绍的内容是html设置表格边框样式,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下     html设置表格边框样式 设置表格边框样式 .border_distance{ border-collapse: collapse; /**设置小表格之间的间距为0*/ border-…

    好文分享 2025年12月21日
    000
  • HTML 文字的左右来回移动

    这篇文章介绍的内容是HTML 文字的左右来回移动  ,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下   HTML marquee 元素() 用来插入一段滚动的文字。你可以使用它的属性控制当文本到达容器边缘发生的事情。behavior:        设置文本在 marquee 元素内…

    2025年12月21日
    000
  • html 图像标记 META标签 内联框架 超链接

    这篇文章介绍的内容是html 图像标记 META标签 内联框架 超链接 ,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 1.图像标记 @@##@@ width=” ”宽度  height=” ” 高度  src=“ ”路径地址 alt=“ ” 描述 @@##@@ ps:为了图片显示不…

    好文分享 2025年12月21日
    000
  • HTML之交互

    这篇文章介绍的内容是关于HTML之交互,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 1.网站怎样与用户进行交互?答案是使用HTML表单(form)。表单是可以把浏览者输入的数据传送到服务器端,这样服务器端程序就可以处理表单传过来的数据。  结束。 2).action :浏览者输入的…

    好文分享 2025年12月21日
    000
  • 动态生成HTML元素并为元素追加属性

    这篇文章主要介绍了关于动态生成HTML元素并为元素追加属性,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 动态生成HTML元素的方法由三种: 第一种:document.createelement()创建元素,再用appendchild()方法将元素添加到指定节点; 添加a元素: va…

    好文分享 2025年12月21日
    000
  • 关于HTML的简介

    这篇文章介绍的内容是关于HTML的简介 ,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 html介绍    HTML 是用来描述网页的一种语言。    ·HTML 指的是超文本标记语言: HyperText Markup Language    ·HTML 不是一种编程语言,而是一种…

    2025年12月21日
    000
  • 解决html视图解析器,html乱码

    这篇文章介绍的内容是解决html视图解析器,html乱码,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 项目编码,html页面编码浏览器解析编码都应该一致 html页面可以添加: html视图解析器: org.springframework.web.servlet.view.free…

    好文分享 2025年12月21日
    000
  • HTML条件注释用法诠释

    这篇文章主要介绍了关于HTML条件注释用法诠释 ,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 HTML条件注释用法诠释 注释内容以样式为例,如下: 1、支持所有IE浏览器 2、支持非IE浏览器 上面是除了IE浏览器外所有浏览器都识别这个样式,另外CSS-TRICKS的《How To…

    好文分享 2025年12月21日
    000

发表回复

登录后才能评论
关注微信