HTML - Marquee跑马灯

HTML - Marquee跑马灯 首页 / HTML入门教程 / HTML - Marquee跑马灯

HTML字幕是滚动的一段文本,根据设置在屏幕上横向显示或垂直向下显示。 这是通过使用HTML marquees标签创建的。

注意-HTML5中不推荐使用marquee标签。 不要使用此元素,而是可以使用JavaScript和CSS来创建这样的效果。

Marquee 语法

使用HTML marquee标签的简单语法如下-

<marquee attribute_name="attribute_value"....more attributes>
   One or more lines or text message or image
</marquee>

Marquee 属性

以下是可以与marquee标签一起使用的重要属性的列表。

Sr.NoAttribute & Remark
1

width

这指定了选取框的宽度。该值可以是10%或20%等。

2

height

这指定了选取框的高度。该值可以是10%或20%等。

3

direction

这指定选框滚动的方向。该值可以是up,down,left或right之类的值。

4

behavior

这指定了字幕滚动的类型。它可以具有 scroll,lide 和 alternate 之类的值。

链接:https://www.learnfk.comhttps://www.learnfk.com/html/html-marquees.html

来源:LearnFk无涯教程网

5

scrolldelay

这指定两次跳转之间的延迟时间。这将具有10等的值。

6

scrollamount

这指定选取框文字的速度。它的值可以是10等。

7

loop

这指定要循环多少次。默认值为INFINITE,这意味着选取框无限循环。

8

bgcolor

这根据颜色名称或十六进制值指定背景颜色。

9

hspace

这指定选框周围的水平空间。该值可以是10%或20%等。

10

vspace

这指定选框周围的垂直空间。该值可以是10%或20%等。

以下是一些示例来说明字幕标签的用法。

示例1

<!DOCTYPE html>
<html>

   <head>
      <title>HTML marquee Tag</title>
   </head>
	
   <body>
      <marquee>This is basic example of marquee</marquee>
   </body>
	
</html>

这将产生以下输出-

无涯教程网

示例2

<!DOCTYPE html>
<html>

   <head>
      <title>HTML marquee Tag</title>
   </head>
	
   <body>
      <marquee width="50%">This example will take only 50% width</marquee>
   </body>
	
</html>

这将产生以下输出-

无涯教程网

示例3

<!DOCTYPE html>
<html>

   <head>
      <title>HTML marquee Tag</title>
   </head>

   <body>
      <marquee direction="right">This text will scroll from left to right</marquee>
   </body>
	
</html>

这将产生以下输出-

无涯教程网

示例4

<!DOCTYPE html>
<html>

   <head>
      <title>HTML marquee Tag</title>
   </head>
	
   <body>
      <marquee direction="up">This text will scroll from bottom to up</marquee>
   </body>
	
</html>

这将产生以下输出-

无涯教程网

祝学习愉快!(内容编辑有误?请选中要编辑内容 -> 右键 -> 修改 -> 提交!)

技术教程推荐

许式伟的架构课 -〔许式伟〕

Flutter核心技术与实战 -〔陈航〕

性能工程高手课 -〔庄振运〕

.NET Core开发实战 -〔肖伟宇〕

分布式协议与算法实战 -〔韩健〕

手把手带你搭建秒杀系统 -〔佘志东〕

技术领导力实战笔记 2022 -〔TGO 鲲鹏会〕

B端产品经理入门课 -〔董小圣〕

结构沟通力 -〔李忠秋〕

好记忆不如烂笔头。留下您的足迹吧 :)