html marquee標簽使用示例介紹

2020-03-22 19:22:56

字體：大中小

來源：轉載

供稿：網友

該標簽不是HTML3.2的一部分，并且只支持MSIE3以后內核，所以如果你使用非IE內核瀏覽器(如：Netscape)可能無法看到下面一些很有意思的效果
該標簽是個容器標簽

Marquee 公告滾動代碼

最簡單的網站公告滾動代碼，基于Marquee走馬燈，豎直向上滾動，Table表格形式，不懂CSS也能用。

提示：您可以先修改部分代碼再運行

語法：

marquee /marquee

以下是一個最簡單的例子：

代碼如下:

復制代碼代碼如下:
marquee font size=+3 color=red Hello, World /font /marquee

下面這兩個事件經常用到：

onMouseOut= this.start() ：用來設置鼠標移出該區域時繼續滾動
quot;this.stop() ：用來設置鼠標移入該區域時停止滾動

代碼如下:

復制代碼代碼如下:
marquee onMouseOut="this.start()" onMouseOut="this.start()" ：用來設置鼠標移出該區域時繼續滾動：用來設置鼠標移入該區域時停止滾動 /marquee

這是一個完整的例子：

代碼如下:

復制代碼代碼如下:
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()"
這是一個完整的例子
/marquee

該標簽支持的屬性多達11個：

align

設定 marquee 標簽內容的對齊方式
absbottom：絕對底部對齊（與g、p等字母的最下端對齊）
absmiddle：絕對中央對齊
baseline：底線對齊
bottom：底部對齊（默認）
left：左對齊
middle：中間對齊
right：右對齊
texttop：頂線對齊
top：頂部對齊

代碼如下:

復制代碼代碼如下:
marquee align="absbottom" align="absbottom"：絕對底部對齊（與g、p等字母的最下端對齊）。 /marquee
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

behavior

設定滾動的方式：

alternate：表示在兩端之間來回滾動。
scroll：表示由一端滾動到另一端，會重復。
slide：表示由一端滾動到另一端，不會重復。

代碼如下:

復制代碼代碼如下:
marquee behavior="alternate" alternate：表示在兩端之間來回滾動。 /marquee
marquee behavior="scroll" scroll：表示由一端滾動到另一端，會重復。 /marquee
marquee behavior="slide" slide：表示由一端滾動到另一端，不會重復。 /marquee

bgcolor

設定活動字幕的背景顏色，背景顏色可用RGB、16進制值的格式或顏色名稱來設定。

代碼如下:

復制代碼代碼如下:
marquee bgcolor="#006699" 設定活動字幕的背景顏色 bgcolor="#006699" /marquee
marquee bgcolor="RGB(10%,50%,100%,)" 設定活動字幕的背景顏色 bgcolor="rgb(10%,50%,100%,)" /marquee
marquee bgcolor="red" 設定活動字幕的背景顏色 bgcolor="red" /marquee

direction

設定活動字幕的滾動方向

代碼如下:

復制代碼代碼如下:
marquee direction="down" 設定活動字幕的滾動方向direction="down"：向下 /marquee
marquee direction="left" 設定活動字幕的滾動方向direction="left"：向左 /marquee
marquee direction="right" 設定活動字幕的滾動方向direction="right"：向右 /marquee
marquee direction="up" 設定活動字幕的滾動方向direction="up"：向上 /marquee

height

設定活動字幕的高度

代碼如下:

復制代碼代碼如下:
marquee height="500" direction="down" bgcolor="#CCCCCC" 設定活動字幕的高度height="500" /marquee

width

設定活動字幕的寬度

代碼如下:

復制代碼代碼如下:
marquee width="500" bgcolor="#CCCCCC" 設定活動字幕的寬度width="500" /marquee

hspace

設定活動字幕里所在的位置距離父容器水平邊框的距離

This controls the horizontal（水平）space around the display box.

代碼如下:

復制代碼代碼如下:
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

設定活動字幕里所在的位置距離父容器垂直邊框的距離

This controls the vertical（垂直） space around the display box.

代碼如下:

復制代碼代碼如下:
marquee vspace="100" bgcolor="#CCCCCC" hspace="100" /marquee

loop

設定滾動的次數，當loop=-1表示一直滾動下去，默認為-1
代碼如下:

復制代碼代碼如下:
marquee loop="-1" bgcolor="#CCCCCC" 我會不停地走。 /marquee
p nbsp; /p
marquee loop="2" bgcolor="#CCCCCC" 我只走兩次哦 /marquee

scrollamount

設定活動字幕的滾動速度，單位pixels

代碼如下:

復制代碼代碼如下:
marquee scrollamount="10" scrollamount="10" /marquee
marquee scrollamount="20" scrollamount="20" /marquee
marquee scrollamount="30" scrollamount="30" /marquee

scrolldelay

設定活動字幕滾動兩次之間的延遲時間，單位millisecond（毫秒）
值大了會有一步一停頓的效果

代碼如下:

復制代碼代碼如下:
marquee scrolldelay="10" scrolldelay="10" /marquee
marquee scrolldelay="100" scrolldelay="100" /marquee
marquee scrolldelay="1000" scrolldelay="1000" /marquee
html教程

鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。

上一篇：去掉HTML中Inline-Block的空白的方法

下一篇：淺談html中input只讀屬性readonly和disable的區別