Marquee is an effect which is used to scroll some content of an HTML element horizontally or vertically. The content can be anything like some text or an image.
The marquee-speed property is used to specify the speed of a marquee (moving content).
CSS
marquee-speed: value;
While using marquee, sometimes the moving content of an element cannot be fit inside the element. In that case, the overflow property is used to hide the overflowing content. Also, the overflow-style property can be used to specify that the content will be displayed as a marquee by taking one of the two values - marquee-line (creates horizontal marquees) and marquee-block(creates vertical marquees).
This property is not fully supported by W3C.
Values
slow : This scrolls the content at a slow speed.
normal : This scrolls the content at a normal speed. This is the default value.
fast : This scrolls the content at a fast speed.
initial : Sets the default value.
inherit : Inherits the value of the parent element.
In order to get support from Webkit-based browsers, you need to add the prefix -webkit- before the property.
Example
In the following example, the second paragraph is given marquee-speed: fastwhich will move its text at a fast speed while the first paragraph will move its text at a normal speed.
HTML
<p>This text scrolls at a normal speed.</p>
<p id="marquee1">This text scrolls at a fast speed.</p>
CSS
/* for Chrome and Safari */
#marquee1 {
overflow-x: -webkit-marquee;
-webkit-marquee-style: scroll;
-webkit-marquee-speed: fast;
}
/* for all */
#marquee1 {
overflow-x: marquee-line;
marquee-style: scroll;
marquee-speed: fast;
}
In the above code, writing overflow-x: marquee-line or overflow-x: -webkit-marquee is equivalent to writing overflow-style: marquee.
Browser Support
The marquee module is excluded by the W3C from the CSS3 specification. Since this property is not fully supported by W3C, therefore it is recommended not to use this property.
