HTML Marquee Tag

 The <marquee> tag in HTML is used to create scrolling text or images. It is a non-standard HTML element and is no longer recommended for use because it has been deprecated in HTML5. Instead, CSS animations should be used for scrolling effects. However, it is still supported by many browsers for backward compatibility.


Basic Syntax:

<marquee>Scrolling text goes here</marquee>

Attributes of <marquee>

Here is a list of attributes you can use with <marquee> and their descriptions:



Examples

1. Basic Scrolling Text

<marquee>Welcome to our website!</marquee>

2. Scrolling in Alternate Direction

<marquee behavior="alternate" bgcolor="lightblue">This text bounces back and forth!</marquee>

3. Scrolling Vertically

<marquee direction="up" scrollamount="5">Scrolling up!</marquee>

4. Scrolling with Delay and Loop

<marquee scrollamount="10" scrolldelay="200" loop="3">This text will scroll three times with a delay.</marquee>

5. Custom Size and Background

<marquee width="300px" height="50px" bgcolor="#ffcccb">This marquee has a background color!</marquee>

Important Notes:

  1. The <marquee> tag is considered obsolete. It is not supported in HTML5 for modern web standards.
  2. Use CSS animations instead for better compatibility and control. Example (CSS alternative):
    <div style="width: 300px; white-space: nowrap; overflow: hidden; border: 1px solid black;">
      <div style="display: inline-block; animation: scroll-left 5s linear infinite;">
        Scrolling text with CSS!
      </div>
    </div>
    <style>
      @keyframes scroll-left {
        from {
          transform: translateX(100%);
        }
        to {
          transform: translateX(-100%);
        }
      }
    </style>

Let me know if you need help transitioning from <marquee> to modern CSS!



Comments

Popular posts from this blog

Introduction to Computer

History of Computer

Computer Generation