迹忆客 专注技术分享

当前位置:主页 > 学无止境 > WEB前端 > HTML >

更改 HTML 字幕文本速度

作者:迹忆客 最近更新:2023/05/05 浏览次数:

在 HTML 中,我们可以使用 <marquee> 标签来创建移动或滚动的文本动画。 它允许我们创建从左到右、从右到左、从下到上和从上到下四个方向的滚动文本,改变速度并设置方向属性的值来设置滚动的方向 文本。

本文将重点关注改变 HTML 中 <marquee> 标签的速度。


使用<marquee>标签的scrollamount属性控制文本的滚动速度

scrollamount 属性设置 <marquee> 标签文本的滚动速度。 它采用字符串格式的数字值。

该属性的值表明它将在特定时间间隔内滚动多少像素。 scrollamount 属性的默认值为 6px。

例如,我们创建了具有不同 scrollamount 值的不同 <marquee> 标签。 在输出中,用户可以观察具有不同滚动量的文本的速度。

随着 scrollamount 的值越多,文本会移动得越快。

代码示例:

<marquee behavior=scroll direction="left" scrollamount="2">scrollamount = 2</marquee>
<marquee behavior=scroll direction="left" scrollamount="6">scrollamount = 6</marquee>
<marquee behavior=scroll direction="right" scrollamount="10">scrollamount = 10</marquee>
<marquee behavior=scroll direction="right" scrollamount="15">scrollamount = 15</marquee>

输出:

使用 marquee 标签的 scrollamount 属性控制文本的滚动速度

在上面的输出中,根据 scrollamount 和 direction 属性值,用户可以看到不同的文本以不同的速度向不同的方向移动。


使用 <marquee> 标签的scrolldelay属性控制文本的滚动速度

我们可以使用 scrolldelay 属性来设置每次滚动之间的时间间隔。 它接受字符串格式的毫秒值。

scrolldelay 属性的默认值为 85,它不接受低于 60 的值。在这个例子中,我们创建了具有不同 scrolldelay 属性值的不同 <marquee> 标签。

代码示例:

<marquee behavior=scroll direction="left" scrolldelay="200">scrolldelay = 200ms</marquee>
<marquee behavior=scroll direction="right" scrolldelay="61">scrolldelay = 61ms</marquee>
<marquee behavior=scroll direction="left" scrolldelay="300">scrolldelay = 300ms</marquee>
<marquee behavior=scroll direction="right" scrolldelay="150">scrolldelay = 150ms</marquee>

随着 scrolldelay 属性值的增加,随着每次滚动之间的间隔增加,文本移动速度变慢。 scrolldelayscrollamount 属性在 HTML5 中已弃用。 因此,某些现代浏览器可能不支持它。

转载请发邮件至 1244347461@qq.com 进行申请,经作者同意之后,转载请以链接形式注明出处

本文地址:

相关文章

HTML 中的 role 属性

发布时间:2023/05/06 浏览次数:124 分类:HTML

本篇文章介绍 HTML role属性。HTML中 role 属性介绍,role 属性定义描述语义的 HTML 元素的角色。

在 HTML 中打印时分页

发布时间:2023/05/06 浏览次数:188 分类:HTML

本篇文章介绍如何在打印 HTML 页面或内容时强制分页。将 page-break-after 属性设置为 always Inside @media print to Page Break in HTML

在 HTML 中显示基于 Cookie 的图像

发布时间:2023/05/06 浏览次数:154 分类:HTML

本文介绍如何根据 HTML 中的 cookies 显示图像。根据 HTML 中设置的 Cookies 显示图像。问题陈述是我们需要根据网页传递的cookie来显示特定的图像。

在 HTML 中创建下载链接

发布时间:2023/05/06 浏览次数:140 分类:HTML

本文介绍如何在 HTML 中创建下载链接。使用 download 属性在 HTML 中创建下载链接.。我们可以使用 HTML 锚元素内的下载属性来创建下载链接。

HTML 中的 ::before 选择器

发布时间:2023/05/06 浏览次数:70 分类:HTML

本教程介绍 CSS ::before 伪元素。CSS ::before 伪元素。 ::before 选择器是一个 CSS 伪元素,我们可以使用它在一个或多个选定元素之前插入内容。 它默认是内联的。

在 HTML 中创建一个可滚动的 Div

发布时间:2023/05/06 浏览次数:54 分类:HTML

本篇文章介绍如何使 HTML div 可滚动。本文将介绍在 HTML 中使 div 可滚动的方法。 我们将探索垂直和水平滚动,并通过示例查看它们的实现。

HTML 显示箭头的代码

发布时间:2023/05/06 浏览次数:153 分类:HTML

一篇关于用于显示箭头的 Unicode 字符实体的紧凑文章。本文讨论使用 Unicode 字符实体在我们的 HTML 页面上显示不同的字符。 HTML 中使用了许多实体,但我们将重点学习表示上、下、左、右的三角

在 HTML 中启用和禁用复选框

发布时间:2023/05/06 浏览次数:149 分类:HTML

本篇文章介绍如何启用和禁用 HTML 中的复选框。HTML 中的复选框 复选框是一个交互式框,可以切换以表示肯定或否定。 它广泛用于表单和对话框。

HTML 中的只读复选框

发布时间:2023/05/06 浏览次数:198 分类:HTML

本篇文章介绍了如何在 HTML 中制作只读复选框。本文是关于如何使 HTML 复选框控件成为只读组件的快速破解。 但是,首先,让我们简要介绍一下复选框控件。

扫一扫阅读全部技术教程

社交账号
  • https://www.github.com/onmpw
  • qq:1244347461

最新推荐

教程更新

热门标签

扫码一下
查看教程更方便