HTML 中通过使用 <marquees> 标签实现文字页面的滚动效果,根据设置在网页上水平或垂直向下显示。

注意 - HTML5 中已弃用 <marquees> 标记。不要使用此元素,您可以使用 JavaScript 和 CSS 来创建此类效果。

语法

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

<marquee attribute_name = "attribute_value"....more attributes>
   要滚动的文本或者图像内容
</marquee>

<marquee> 标签属性

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

序号属性和说明
1

width

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

2

height

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

3

direction

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

4

behavior

这指定选取框的滚动类型。它的值可以是 scroll、slidealternate

5

scrolldelay

这指定每次跳转之间延迟多长时间。这将具有类似于 10 等值。

6

scrollmount

这指定了选取框文本的速度。该值可以是 10 等值。

7

loop

这指定循环次数。默认值为 INFINITE,表示选取框无限循环。

8

bgcolor

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

9

hspace

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

10

vspace

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

下面是几个示例来演示滚动标签的用法。

示例 - 1

<!DOCTYPE html>
<html>

   <head>
      <title>HTML marquee 标签</title>
   </head>
	
   <body>
      <marquee>这是marquee的基本示例</marquee>
   </body>
	
</html>

测试一下

示例 - 2

<!DOCTYPE html>
<html>

   <head>
      <title>HTML marquee 标签</title>
   </head>
	
   <body>
      <marquee width = "50%">此示例仅占用 50% 的宽度</marquee>
   </body>
	
</html>

测试一下

示例 - 3

<!DOCTYPE html>
<html>

   <head>
      <title>HTML marquee 标签</title>
   </head>

   <body>
      <marquee direction = "right">该文本将从左向右滚动</marquee>
   </body>
	
</html>

测试一下

示例 - 4

<!DOCTYPE html>
<html>

   <head>
      <title>HTML marquee 标签</title>
   </head>
	
   <body>
      <marquee direction = "up">该文本将从下向上滚动</marquee>
   </body>
	
</html>

测试一下