Detailed explanation of the marquee attribute in HTML
|
This tag is not part of HTML3.2 and is only supported by MSIE3 and later kernels, so if you use a non-IE kernel browser (such as Netscape) you may not be able to see some of the following interesting effects This tag is a container tag grammar: <marquee></marquee> Here is a simple example: The code is as follows: <marquee><font size=+3 color=red>Hello, World</font></marquee> The following two events are often used: onMouseOut="this.start()": Used to set the mouse to continue scrolling when it moves out of the area onMouseOver="this.stop()": used to stop scrolling when the mouse moves into this area The code is as follows: <marquee onMouseOut="this.start()" onMouseOver="this.stop()">onMouseOut="this.start()" : Used to set the mouse to continue scrolling when it moves out of the area onMouseOver="this.stop()" : Used to set the mouse to stop scrolling when it moves into the area</marquee> Here is a complete example: The code is as follows: <marquee id="affiche" align="left" behavior="scroll" bgcolor="#FF0000" direction="up" height="300" width="200" hspace="50" vspace="20" loop="-1" scrollamount="10" scrolldelay="100" onMouseOut="this.start()" onMouseOver="this.stop()"> Here is a complete example</marquee> This tag supports up to 11 attributes: align Set the alignment of the <marquee> tag content absbottom: Absolute bottom alignment (aligned with the bottom of letters such as g and p) The code is as follows: <marquee align="absbottom">align="absbottom": absolute bottom alignment (aligned with the bottom of letters such as g and p). </marquee> <marquee align="absmiddle">align="absmiddle": absolute center alignment. </marquee> <marquee align="baseline">align="baseline": Align the baseline. </marquee> <marquee align="bottom">align="bottom": bottom alignment (default). </marquee> <marquee align="left">align="left": left aligned. </marquee> <marquee align="middle">align="middle": align in the middle. </marquee> <marquee align="right">align="right": right aligned. </marquee> <marquee align="texttop">align="texttop": top line aligned. </marquee> <marquee align="top">align="top": top alignment. </marquee> behavior Set the scrolling method: alternate: means rolling back and forth between the two ends. scroll: means scrolling from one end to the other and repeating. slide: means scrolling from one end to the other without repeating. The code is as follows: <marquee behavior="alternate">alternate: means scrolling back and forth between the two ends. </marquee> <marquee behavior="scroll">scroll: means scrolling from one end to the other and repeating. </marquee> <marquee behavior="slide">slide: means scrolling from one end to the other without repeating. </marquee> bgcolor Set the background color of the active subtitle. The background color can be set in RGB, hexadecimal value format or color name. The code is as follows: <marquee bgcolor="#006699">Set the background color of the active subtitle bgcolor="#006699"</marquee> <marquee bgcolor="RGB(10%,50%,100%,)">Set the background color of the active subtitles bgcolor="rgb(10%,50%,100%,)"</marquee> <marquee bgcolor="red">Set the background color of the active subtitle bgcolor="red"</marquee> direction Set the scroll direction of the active subtitles The code is as follows: <marquee direction="down">Set the scroll direction of the active subtitle direction="down": downward</marquee> <marquee direction="left">Set the scroll direction of the active subtitle direction="left": left</marquee> <marquee direction="right">Set the scroll direction of the active subtitle direction="right": right</marquee> <marquee direction="up">Set the scroll direction of the active subtitle direction="up": upward</marquee> height Set the height of the active subtitle The code is as follows: <marquee height="500" direction="down" bgcolor="#CCCCCC">Set the height of the active subtitle height="500"</marquee> width Set the width of the active subtitle The code is as follows: <marquee width="500" bgcolor="#CCCCCC">Set the width of the active subtitle width="500"</marquee> hspace Set the distance between the position of the active subtitle and the horizontal border of the parent container This controls the horizontal space around the display box. The code is as follows: <table width="500" border="1" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><marquee hspace="100" bgcolor="#CCCCCC">hspace="100"</marquee></td>
</tr>
</table>vspace Set the distance between the position of the active subtitle and the vertical border of the parent container This controls the vertical space around the display box. The code is as follows: <marquee vspace="100" bgcolor="#CCCCCC">hspace="100"</marquee> loop Set the number of scrolling times. When loop=-1, it means scrolling all the time. The default value is -1 The code is as follows: <marquee loop="-1" bgcolor="#CCCCCC">I will keep walking. </marquee> <p> </p> <marquee loop="2" bgcolor="#CCCCCC">I only walk twice</marquee> scrollamount Set the scrolling speed of the active subtitles in pixels The code is as follows: <marquee scrollamount="10" >scrollamount="10" </marquee> <marquee scrollamount="20" >scrollamount="20" </marquee> <marquee scrollamount="30" >scrollamount="30" </marquee> scrolldelay Set the delay time between scrolling the active subtitle twice, in milliseconds. If the value is too large, there will be a pause effect. The code is as follows: <marquee scrolldelay="10" >scrolldelay="10" </marquee> <marquee scrolldelay="100" > scrolldelay="100" </marquee> <marquee scrolldelay="1000">scrolldelay="1000" </marquee> The above is a detailed explanation of the marquee attribute in HTML that I introduced to you. I hope it will be helpful to you. If you have any questions, please leave me a message and I will reply to you in time. I would also like to thank everyone for their support of the 123WORDPRESS.COM website! |
<<: Cleverly use CSS3's webkit-box-reflect to achieve various dynamic effects
>>: Font references and transition effects outside the system
Recommend
One line of code teaches you how to hide Linux processes
Friends always ask me how to hide Linux processes...
MySQL join buffer principle
Table of contents 1. MySQL join buffer 2. JoinBuf...
Analysis of MySQL query sorting and query aggregation function usage
This article uses examples to illustrate the use ...
A detailed introduction to the three installation methods of rpm, yum and source code under Linux
Chapter 1 Source Code Installation The installati...
Personal opinion: Talk about design
<br />Choose the most practical one to talk ...
Three BOM objects in JavaScript
Table of contents 1. Location Object 1. URL 2. Pr...
Windows10 mysql 8.0.12 non-installation version configuration startup method
This article shares the specific steps for config...
Summary of web design experience and skills
■ Website theme planning Be careful not to make yo...
Detailed explanation of explain type in MySQL
Introduction: In many cases, many people think th...
Ubuntu starts the SSH service remote login operation
ssh-secure shell, provides secure remote login. W...
Detailed explanation of mysql exists and not exists examples
Detailed explanation of mysql exists and not exis...
Detailed explanation of HTML area tag
The <area> tag defines an area in an image ...
jQuery implements dynamic tag event
This article shares the specific code of jQuery t...
Introduction to new features of ECMAscript
Table of contents 1. Default values for functio...
Perfect solution to the problem of not being able to access the port of the docker container under Windows 10
Solve the problem of not being able to access the...