HTML Marquee
This page contains HTML marquee code that you can use on your own website or blog. Specifically, it uses the HTML <marquee> element to create a marquee.
Note that the HTML <marquee> tag is non-standard HTML, and it's recommended that you use a CSS Marquee instead.
However, if you have some reason not to use CSS, below is the code for an HTML marquee.
Scrolling Text
Here's an example of what you can do with the HTML <marquee> tags.
| Source Code | Result |
|---|---|
In the above example, everything between the <marquee></marquee> tags scrolls across the page. In this example, we only put text into the marquee, but we could just have easily put an image into it.
Scrolling Image
Here's an example of a scrolling image. All we did was place HTML image code in between the <marquee></marquee> tags.
| Source Code | Result |
|---|---|
Bouncing Text
You can also make the content bounce back and forth. To do this, use behavior="alternate".
| Source Code | Result |
|---|---|
Scrolling Vertically
You can scroll vertically too—just use direction="up" or direction="down".
| Source Code | Result |
|---|---|
HTML Marquees vs CSS Marquees
HTML marquees (i.e. coded using the <marquee> tag) are a quick and easy way to add a marquee to your web page or blog. With no more than one line of code, you can have scrolling text or images. And the code is easy to remember — just the <marquee> tag plus a handful of attributes.
The problem with the <marquee> tag is that it's not actually part of the official HTML specification. Therefore, if you need your HTML pages to be fully standards compliant, you will need to avoid HTML marquees and use CSS marquees instead.
CSS marquees can be coded using CSS animations. CSS animations are being included in the official CSS specifications (from CSS3) and therefore, will allow you to use marquees, whilst keeping your web pages fully standards compliant.
The main downside with CSS marquees is that they can take longer to code (more code is required). However, they are more powerful, and you can use them to create advanced animations as well as a simple marquee.
Given that CSS is concerned with the style of the content and HTML is not, CSS is a logical tool to use for marquees.
More Marquee Codes
You can do much more with HTML marquees than is covered on this page. Here's the full list of marquee codes on this website:
Marquee Generator
Also check out the Marquee Generator.
Marquee Usability
Try to be careful when using HTML marquees. Many web users dislike websites that contain scrolling or bouncing images and other elements, so try to use them tastefully :)