＜marquee＞标签，什么是marquee标签?

最新推荐文章于 2023-08-18 16:02:06 发布

蒙面大婶l

最新推荐文章于 2023-08-18 16:02:06 发布

阅读量1.8k

点赞数

文章标签：前端 html css

本文链接：https://blog.csdn.net/mengxiaodi/article/details/132362735

版权

本文详细介绍了HTML中的marquee标签及其主要属性，如behavior（滚动模式）、bgcolor（背景颜色）、direction（滚动方向）、loop（滚动次数）和scrollamount/delay（滚动速度），并提供了示例代码和效果展示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

首先，marquee是一个双标签，是HTML标签中创建文字滚动的标签。

示例效果图如下：

跑汽车

<marquee>标签的属性主要有behavior、bgcolor、direction、width、height、hspace、vspace、loop、scrollamount、scrolldelay等

behavior属性：

设置文本在marquee元素内如何滚动。
参数值有：alternate、scroll和slide，分别表示文字来回滚动、单方向滚动、只滚动一次。
例如：
<marquee behavior="alternate">来回滚动</marquee>
<marquee behavior="scroll">单方向循环滚动</marquee>
<marquee behavior="slide">只滚动一次</marquee>

bgcolor属性：

文字滚动范围的背景颜色，参数值是英文字符（提前定义好的）或十六进制(使用#开头)#ffffff

direction属性：

设置 marquee 内文本滚动的方向，参数值有：left，right，up，down（默认值为left）
分别代表滚动方向向下、向左、向右、向上。
如下所示:
<marquee direction="right">向右滚动</marquee>
<marquee direction="down">向下滚动</marquee>

loop属性：

设置 marquee 滚动的次数，默认值为 −1，当参数位-1时，marquee 将连续滚动，参数为infinite时将无限循环。
例如：
<marquee loop="infinite">无限循环滚动</marquee>
<marquee loop="-1">无限循环滚动</marquee>

scrolldelay和truespeed属性：

这两个属性决定文字滚动的时间间隔(scrollamount)以毫秒为单位默认值为 85，和延时(scrolldelay)，
参数值都是正整数。

例如：
<marquee scrollamount="100">我速度很快.</marquee>
<marquee scrolldelay="50">我慢了些。</marquee>
练习：

<body>
    <marquee behavior="alternate" direction="right"><img src="./images/cat.jpeg" alt=""></marquee>
    <marquee behavior="alternate" direction="left">我向左跑.....</marquee>
    <marquee direction="right">我向右跑.....</marquee> 
    <marquee behavior="alternate" loop="-1">我自无限循环的跑</marquee>
    <marquee scrollamount="50">我跑的最快</marquee> 
    <marquee scrolldelay="1000" scrollamount="100" direction="right">~~~呀呼</marquee> 
</body>