2972

15 分钟

#HTML 的 <marquee> 标签

#属性

  • behavior(废弃): 设置文本在 marquee 元素内如何滚动。可选值有 scroll、slide 和 alternate。如果未指定值,默认值为 scroll。
  • bgcolor(废弃): 通过颜色名称或十六进制值设置背景颜色。
  • direction(废弃): 设置 marquee 内文本滚动的方向。可选值有 left、right、up 和 down。如果未指定值,默认值为 left。
  • height(废弃): 以像素或百分比值设置高度。
  • hspace(废弃): 设置水平边距。
  • loop(废弃): 设置 marquee 滚动的次数。如果未指定值,默认值为 −1,表示 marquee 将连续滚动。
  • scrollamount(废弃): 设置每次滚动时移动的长度(以像素为单位)。默认值为 6。
  • scrolldelay(废弃): 设置每次滚动时的时间间隔(以毫秒为单位)。默认值为 85。请注意,除非指定 truespeed 值,否则将忽略任何小于 60 的值,并改为使用 60。
  • truespeed(废弃): 默认情况下,会忽略小于 60 的 scrolldelay 值。如果存在 truespeed,那些值不会被忽略。
  • vspace(废弃): 以像素或百分比值设置垂直边距。
  • width(废弃): 以像素或百分比值设置宽度。

#示例

<div class="marquee-container"> <p>基本用法</p> <marquee>这是一个基本的滚动文字效果</marquee> </div> <div class="marquee-container"> <p>从右向左滚动</p> <marquee direction="left" class="styled-marquee">这个文本会从右向左滚动 (默认方向)</marquee> </div> <div class="marquee-container"> <p>从左向右滚动</p> <marquee direction="right">这个文本会从左向右滚动</marquee> </div> <div class="marquee-container"> <p>上下滚动</p> <marquee direction="up" height="100" bgcolor="#e3f2fd">这个文本会向上滚动<br>可以设置高度和背景色</marquee> </div> <div class="marquee-container"> <p>滚动速度控制</p> <marquee scrollamount="5">慢速滚动 (scrollamount=5)</marquee> <marquee scrollamount="20" style="margin-top: 10px;">快速滚动 (scrollamount=20)</marquee> </div> <div class="marquee-container"> <p>鼠标悬停暂停</p> <marquee behavior="scroll" direction="left" onmouseover="this.stop()" onmouseout="this.start()"> 鼠标悬停在我上面会暂停,移开会继续滚动 </marquee> </div>

<marquee>

基本用法

这是一个基本的滚动文字效果

从右向左滚动

这个文本会从右向左滚动 (默认方向)

从左向右滚动

这个文本会从左向右滚动

上下滚动

这个文本会向上滚动
可以设置高度和背景色

滚动速度控制

慢速滚动 (scrollamount=5) 快速滚动 (scrollamount=20)

鼠标悬停暂停

鼠标悬停在我上面会暂停,移开会继续滚动
  • 废弃元素的演示可能不会生效

创建于 2025/6/9

更新于 2025/6/13