HTML <marquee> Tag
A <marquee> HTML Tag is a non-standard HTML element used to scroll horizontally or vertically across an image or text.
In simple words, we can say that it can automatically scroll the image or text up, down, left or right.
Marquee tags were first introduced in early versions of Microsoft’s Internet Explorer. It is compared to Netscape’s Blink Element.
Example:-
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML marquee Tag</title>
</head>
<body>
<h1>This is HTML marquee Tag</h1>
<marquee>Hi KHUSHAL</marquee>
</body>
</html>
Output:-
Attribute:-
- behavior
- direction
- width
- height
- hspace
- vspace
- scrolldelay
- scrollamount
- loop
- bgcolor
Table of Contents
HTML Scroll Marquee
Example:-
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML marquee Tag</title>
</head>
<body>
<h1>This is HTML marquee Tag</h1>
<marquee width="50%" behavior="scroll" bgcolor="lightblue">Hi KHUSHAL</marquee>
</body>
</html>
This is a default property. In this, we will use the bgcolor, behavior, and width attributes. This is used to scroll the text from right to left and restart the right side of the marquee when it reaches the end of the left side. The text disappears after the loop completes.
Output:-
HTML Slide Marquee
In a slide marquee ( behavior=”slide” ), all content to be scrolled will slide the entire length of the marquee but will stop at the end to display the content permanently.
Example:-
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML marquee Tag</title>
</head>
<body>
<h1>This is HTML marquee Tag</h1>
<marquee width="50%" behavior="slide" bgcolor="lightblue">Hi KHUSHAL</marquee>
</body>
</html>
Output:-
HTML Alternate Marquee
It scrolls the text from right to left and back from left to right.
Example:-
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML marquee Tag</title>
</head>
<body>
<h1>This is HTML marquee Tag</h1>
<marquee width="222px" behavior="alternate" bgcolor="lightblue">Hi KHUSHAL</marquee>
</body>
</html>
Output:-
Direction in HTML marquee
It is used to change the direction of the scrolling text. Let’s take the example of a marquee scrolling to the right. The direction can be left, right, up, and down.
Example:-
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML marquee Tag</title>
</head>
<body>
<h1>This is HTML marquee Tag</h1>
<p><strong>direction right</strong></p>
<marquee width="222px" height="100px" direction="right" bgcolor="lightblue">Hi KHUSHAL</marquee> <br><br>
<p><strong>direction left</strong></p>
<marquee width="222px" height="100px" direction="left" bgcolor="lightblue">Hi KHUSHAL</marquee> <br><br>
<p><strong>direction up</strong></p>
<marquee width="222px" height="200px" direction="up" bgcolor="lightblue">Hi KHUSHAL</marquee> <br><br>
<p><strong>direction down</strong></p>
<marquee width="222px" height="200px" direction="down" bgcolor="lightblue">Hi KHUSHAL</marquee>
</body>
</html>
Output:-
direction right
direction left
direction up
direction down