...

Web Technologies - HTML

Back to Course

Lesson Description


Lession - #164 HTML Marquees




An HTML marquee is a scrolling piece of text that, depending on the settings, appears horizontally across or vertically down your webpage. This is accomplished through the use of the HTML <marquees> element.
The <marquee> element is deprecated in HTML5. Instead of using this element, you may generate similar effects with JavaScript and CSS.
Syntax The following is a simple syntax for using the HTML <marquee> tag:
<marquee attribute_name = "attribute_value"....more attributes> One or more lines or text message or image </marquee>

The <marquee> Tag Attributes

Following is the list of important attributes which can be used with <marquee> tag.
Sr.No Attribute & Description
1

width

width This determines the marquee's width. This can be a percentage such as 10% or 20%, for example.

2

height

This determines the marquee's height. This can be a percentage such as 10% or 20%, for example.

3

direction

This determines the direction in which the marquee will scroll. This can be a number such as up, down, left, or right.

4

behavior

This defines the marquee's scrolling style. This can take the form of scroll, slide, or alternative.

5

scrolldelay

This specifies how long to delay between each jump. This will have a value like 10 etc.

6

scrollamount

This controls the speed of the marquee text. This can be a number such as 10, for example.

7

loop

This indicates how many times the loop should be executed. The marquee loops indefinitely if the value is set to INFINITE.

8

bgcolor

bgcolor This provides the background colour as a colour name or hex value.

9

hspace

This specifies horizontal space around the marquee. This can be a value like 10 or 20% etc.

10

vspace

This specifies vertical space around the marquee. This can be a value like 10 or 20% etc.

Examples - 1


<!DOCTYPE html>
<html>

   <head>
      <title>this is HTML marquee Tag</title>
   </head>
    
   <body>
      <marquee>This is the basic example of marquee tag</marquee>
   </body>
    
</html>

Examples - 2


<!DOCTYPE html>
<html>

   <head>
      <title>this is HTML marquee Tag</title>
   </head>
    
   <body>
      <marquee width = "50%">This example will take only 50% width </marquee>
   </body>
    
</html>

Examples - 3


<!DOCTYPE html>
<html>

   <head>
      <title>this is HTML marquee Tag</title>
   </head>

   <body>
      <marquee direction = "right">This text will scroll from left to right side of the screen</marquee>
   </body>
    
</html>

Examples - 4


<!DOCTYPE html>
<html>

   <head>
      <title>This is HTML marquee Tag</title>
   </head>
    
   <body>
      <marquee direction = "up">This text will scroll from bottom to top</marquee>
   </body>
    
</html>