Open In App

How to move a text in HTML ?

Improve
Improve
Like Article
Like
Save
Share
Report

In this article, we will learn how to create moving content on your website using HTML <marquee> tag. The <marquee> tag in HTML is used to create scrolling text or images on a webpage. It scrolls either from horizontally left to right or right to left, vertically from top to bottom or bottom to top.

Syntax:

<marquee> Contents... </marquee>

Steps:

  • Open an HTML file in a text editor to begin.
  • Now place the <marquee> tags before and after the text to enable text movement.
  • Optionally, use the direction attribute within <marquee> to set the text’s movement direction.
  • If desired, use the behavior attribute to alternate the text’s movement direction.
  • At last customize the appearance by adding style attributes like ‘background’, ‘border’, etc, within the <marquee> tag.

Example 1: In this example, we will see the use of a <marquee> tag.

HTML




<!DOCTYPE html>
<html>
 
<body>
    <h2 style="text-align: center; color: green;">
      Welcome To GFG
      </h2>
    <marquee> Lets Move this text.</marquee>
    <marquee direction="right" behavior="alternate"
             style="border:BLACK 2px SOLID">
        Geeks for Geeks
    </marquee>
</body>
 
</html>


Output:

dsa

Output

Example 2: In this example, we will see the use of a <marquee> with width. 

HTML




<!DOCTYPE html>
<html>
<head>
    <title>HTML marquee Tag</title>
    <style>
        #gfg {
            color: green;
            font-size: large;
        }
    </style>
</head>
<body>
    <marquee width="50%"
             id="gfg">
        Geeksforgeeks
    </marquee>
</body>
</html>


Output:

How to move a text in HTML ?

How to move text in HTML?



Last Updated : 29 Dec, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads