HTML marquee tag usage example introduction

Time:2020-2-24

This tag is not part of html3.2, and only supports msie3 kernel, so if you use non IE kernel browser (such as Netscape), you may not see some interesting effects below
This label is a container label

Marquee announcement scroll code

The simplest website announcement scrolling code, based on marquee walking lamp, scrolls vertically and upward, in table form, can be used even if you don’t understand CSS.


Tip: you can modify some code before running

Syntax:

<marquee></marquee>

Here is a simple example:

The code is as follows:

Copy code

The code is as follows:

<marquee><font size=+3 color=red>Hello, World</font></marquee>

The following two events are frequently used:

Onmouseout = “this. Start()”: used to set the mouse to continue scrolling when moving out of the area
OnMouseOver = “this. Stop()”: used to set to stop scrolling when the mouse moves into the area

The code is as follows:

Copy code

The code is as follows:

< marquee onmouseout = “this. Start()” OnMouseOver = “this. Stop()” > onmouseout = “this. Start()”: used to set the mouse to continue scrolling when moving out of the area OnMouseOver = “this. Stop()”: used to set the mouse to stop scrolling when moving in the area < / marquee >

This is a complete example:

The code is as follows:

Copy code

The code is as follows:

<marquee align=”left” behavior=”scroll” bgcolor=”#FF0000″ direction=”up” height=”300″ width=”200″ hspace=”50″ vspace=”20″ loop=”-1″ scrollamount=”10″ scrolldelay=”100″ onMouseOut=”this.start()” onMouseOver=”this.stop()”>
This is a complete example
</marquee>

The tag supports up to 11 properties:

align

Set the alignment of < marquee > label content
Absbotom: absolute bottom (bottom of G, P, etc.)
Absmiddle: absolute central alignment
Baseline: baseline alignment
Bottom: align bottom (default)
Left: align left
Middle: middle
Right: align right
Texttop: top line alignment
Top: align top

The code is as follows:

Copy code

The code is as follows:

< marquee align = “absbotom” > align = “absbotom”: absolute bottom alignment (with the lowest end of G, P, etc.). </marquee>
< marquee align = “absmiddle” > align = “absmiddle”: absolute central alignment. </marquee>
< marquee align = “baseline” > align = “baseline”: baseline alignment. </marquee>
< marquee align = “bottom” > align = “bottom”: bottom alignment (default). </marquee>
< marquee align = “left” > align = “left”: align left. </marquee>
< marquee align = “middle” > align = “middle”: middle alignment. </marquee>
< marquee align = “right” > align = “right”: align right. </marquee>
< marquee align = “texttop” > align = “texttop”: top line alignment. </marquee>
< marquee align = “top” > align = “top”: align at the top. </marquee>

behavior

Set how to scroll:

Alternate: indicates to scroll back and forth between two ends.
Scroll: means to scroll from one end to the other and repeat.
Slide: means to scroll from one end to the other without repetition.

The code is as follows:

Copy code

The code is as follows:

< marquee behavior = “alternate” > alternate: indicates to scroll back and forth between two ends. </marquee>
< marquee behavior = “scroll” > scroll: means to scroll from one end to the other and repeat. </marquee>
< marquee behavior = “slide” > Slide: means to scroll from one end to the other without repetition. </marquee>

bgcolor

Set the background color of the active subtitle. The background color can be set by RGB, hexadecimal value format or color name.

The code is as follows:

Copy code

The code is as follows:

< marquee bgcolor = “” > set the background color of the active subtitle bgcolor = “” < / marquee >
< marquee bgcolor = “RGB (10%, 50%, 100%,)” > set the background color of the active subtitle bgcolor = “RGB (10%, 50%, 100%,)” < marquee >
Set the background color of the active subtitle

direction

Set the scrolling direction of active subtitles

The code is as follows:

Copy code

The code is as follows:

< marquee direction = “down” > set the scrolling direction of the active subtitle direction = “down”: down < / marquee >
< marquee direction = “left” > set the scrolling direction of the active subtitle direction = “left”: left < / marquee >
< marquee direction = “right” > set the scrolling direction of the active subtitle direction = “right”: right < / marquee >
< marquee direction = “up” > set the scrolling direction of the active subtitle: up < / marquee >

height

Set the height of the active caption

The code is as follows:

Copy code

The code is as follows:

Set the height of the active subtitle

width

Set the width of the active caption

The code is as follows:

Copy code

The code is as follows:

< marquee width = “500” bgcolor = “ා CCCCCC” > set the width of active subtitle width = “500” < / marquee >

hspace

Set the distance between the position in the active caption and the horizontal border of the parent container

This controls the horizontal space around the display box

The code is as follows:

Copy code

The code is as follows:

<table width=”500″ border=”1″ align=”center” cellpadding=”0″ cellspacing=”0″>
<tr>
<td><marquee hspace=”100″ bgcolor=”#CCCCCC”>hspace=”100″</marquee></td>
</tr>
</table>

vspace

Set the distance between the position in the active subtitle and the vertical frame of the parent container

This controls the vertical space around the display box

The code is as follows:

Copy code

The code is as follows:

<marquee vspace=”100″ bgcolor=”#CCCCCC”>hspace=”100″</marquee>

loop

Set the number of scrolling times. When loop = – 1, it means scrolling all the time. The default value is – 1
The code is as follows:

Copy code

The code is as follows:

I will keep walking. </marquee>
<p>&nbsp;</p>
I only walk twice

scrollamount

Set the scrolling speed of active subtitles in pixels

The code is as follows:

Copy code

The code is as follows:

<marquee scrollamount=”10″ >scrollamount=”10″ </marquee>
<marquee scrollamount=”20″ >scrollamount=”20″ </marquee>
<marquee scrollamount=”30″ >scrollamount=”30″ </marquee>

scrolldelay

Set the delay time between scrolling active subtitles, in milliseconds
When the value is high, it will have the effect of step by step pause

The code is as follows:

Copy code

The code is as follows:

<marquee scrolldelay=”10″ >scrolldelay=”10″ </marquee>
<marquee scrolldelay=”100″ > scrolldelay=”100″</marquee>
<marquee scrolldelay=”1000″>scrolldelay=”1000″ </marquee>

Recommended Today

What are the new methods of visual + map technology?

Last week, Ren Xiaofeng, chief scientist of Alibaba Gaode map, made a technical exchange with you on the development of computer vision related technology and the application in the field of map travel at the online live broadcast activity of “cloud dialogue” between senior students of Alibaba. The interaction between live broadcast is hot. Especially […]