![](/style/images/good.png)
![](/style/images/bad.png)
html之marquee详解
source link: https://www.cnblogs.com/tuyile006/archive/2007/03/28/691329.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
html之marquee详解
该标签不是HTML3.2的一部分,并且只支持MSIE3以后内核,所以如果你使用非IE内核浏览器(如:Netscape)可能无法看到下面一些很有意思的效果
该标签是个容器标签
语法:
onMouseOut="this.start()" :用来设置鼠标移出该区域时继续滚动
onMouseOver="this.stop()":用来设置鼠标移入该区域时停止滚动
这是一个完整的例子
</marquee>
设定<marquee>标签内容的对齐方式
absbottom:绝对底部对齐(与g、p等字母的最下端对齐)
absmiddle:绝对中央对齐
baseline:底线对齐
bottom:底部对齐(默认)
left:左对齐
middle:中间对齐
right:右对齐
texttop:顶线对齐
top:顶部对齐
<marquee align="absmiddle">align="absmiddle": 绝对中央对齐。 </marquee>
<marquee align="baseline">align="baseline": 底线对齐。 </marquee>
<marquee align="bottom">align="bottom": 底部对齐(默认)。 </marquee>
<marquee align="left">align="left": 左对齐。 </marquee>
<marquee align="middle">align="middle": 中间对齐。 </marquee>
<marquee align="right">align="right": 右对齐。 </marquee>
<marquee align="texttop">align="texttop": 顶线对齐。 </marquee>
<marquee align="top">align="top": 顶部对齐。 </marquee>
设定滚动的方式:
alternate: 表示在两端之间来回滚动。
scroll: 表示由一端滚动到另一端,会重复。
slide: 表示由一端滚动到另一端,不会重复。
<marquee behavior="scroll">scroll:表示由一端滚动到另一端,会重复。</marquee>
<marquee behavior="slide">slide: 表示由一端滚动到另一端,不会重复。</marquee>
设定活动字幕的背景颜色,背景颜色可用RGB、16进制值的格式或颜色名称来设定。
<marquee bgcolor="RGB(10%,50%,100%,)">设定活动字幕的背景颜色 bgcolor="rgb(10%,50%,100%,)"</marquee>
<marquee bgcolor="red">设定活动字幕的背景颜色 bgcolor="red"</marquee>
设定活动字幕的滚动方向
<marquee direction="left">设定活动字幕的滚动方向direction="left":向左</marquee>
<marquee direction="right">设定活动字幕的滚动方向direction="right":向右</marquee>
<marquee direction="up">设定活动字幕的滚动方向direction="up":向上</marquee>
设定活动字幕的高度
<marquee height="500" direction="down" bgcolor="#CCCCCC">设定活动字幕的高度height="500"</marquee>
设定活动字幕的宽度
<marquee width="500" bgcolor="#CCCCCC">设定活动字幕的宽度width="500"</marquee>
设定活动字幕里所在的位置距离父容器水平边框的距离
This controls the horizontal(水平)space around the display box.
<tr>
<td><marquee hspace="100" bgcolor="#CCCCCC">hspace="100"</marquee></td>
</tr>
</table>
设定活动字幕里所在的位置距离父容器垂直边框的距离
This controls the vertical(垂直) space around the display box.
<marquee vspace="100" bgcolor="#CCCCCC">hspace="100"</marquee>
设定滚动的次数,当loop=-1表示一直滚动下去,默认为-1
<p> </p>
<marquee loop="2" bgcolor="#CCCCCC">我只走两次哦</marquee>
设定活动字幕的滚动速度,单位pixels
<marquee scrollamount="20" >scrollamount="20" </marquee>
<marquee scrollamount="30" >scrollamount="30" </marquee>
设定活动字幕滚动两次之间的延迟时间,单位millisecond(毫秒)
值大了会有一步一停顿的效果
<marquee scrolldelay="100" > scrolldelay="100"</marquee>
<marquee scrolldelay="1000">scrolldelay="1000" </marquee>
Recommend
-
48
react-native-text-ticker React Native Text Ticker/Marquee Component.
-
53
Obsolete This feature is obsolete. Although it may still work in some browsers, its use is discouraged since it could be removed at any time. Try to avoid using it.
-
3
How to Code the K72 Marquee Hover Animation Learn how to recreate the direction-aware marquee menu hover effect seen on the website of K72 by Locomotive.
-
5
Marquee Simple React Native marquee component,fully implemented using reanimated v2,support to iOS/Android/Web Jan 31, 2022 1 min read @react...
-
6
React Native Marquee View Help you auto scroll content
-
2
Marquee with Jetpack Compose I few weeks ago I was building a budget tracker with Compose and needed a marquee text, or...
-
4
Carefull Passes $2 Billion in Transactions Analyzed in 2022, Adds New Marquee Partnerships and Products to Suite of Senior Financial Protections
-
3
Marquee React Native Ticker Tape/Marquee/Crawler Nov 20, 2022 1 min read
-
9
Project: CSS Marquee Logo Wall Projects Title: CSS Marquee Logo Wall
-
2
ETHDenver Announces Marquee Speakers Including Danny Ryan, John Linden, Sherri Davidoff, and Frances Haugen The world’s lar...
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK