ホームページ  >  記事  >  ウェブフロントエンド  >  HTML のマーキー属性分析

HTML のマーキー属性分析

高洛峰
高洛峰オリジナル
2018-01-09 14:51:032614ブラウズ

この記事では主に HTML の marquee 属性 に関する関連情報を紹介します。必要な方は参照してください。

このタグは HTML3.2 の一部ではなく、MSIE3 以降のカーネルのみをサポートしているため、非-IE カーネル ブラウザ (Netscape など) では、次の興味深い効果の一部が表示されない可能性があります

このタグはコンテナ タグです

構文:

<marquee></marquee>

以下は最も単純な例です:

コードは次のとおりです以下:

<marquee><font size=+3 color=red>Hello, World</font></marquee>

次の 2 つのイベントがよく使用されます:

onMouseOut="this.start()": マウスが領域の外に出たときにスクロールを続けるように設定するために使用されます

onMouseOver="this.stop() ": マウスがエリア内に移動したときにスクロールを停止するように設定するために使用されます

コードは次のとおりです:

<marquee onMouseOut="this.start()" onMouseOver="this.stop()">onMouseOut="this.start()" :用来设置鼠标移出该区域时继续滚动 onMouseOver="this.stop()":用来设置鼠标移入该区域时停止滚动</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()" onMouseOver="this.stop()">
这是一个完整的例子
</marquee>

このタグは最大 11 をサポートします属性:

align

タグの内容を設定します 配置

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>

動作

スクロール方法を設定します:

alternate: 両端間を前後にスクロールすることを示します。

スクロール: 一方の端からもう一方の端までスクロールすることを意味し、それを繰り返します。

スライド: 繰り返さずに一方の端からもう一方の端までスクロールすることを意味します。

コードは次のとおりです:

<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

アクティブな字幕の位置と水平境界線の間の距離を設定します親コンテナの水平 (水平) スペースを制御します。

コードは次のとおりです:

 <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

アクティブな字幕の位置と垂直境界線の間の距離を設定します。親コンテナ

これは、表示ボックスの周囲の垂直(垂直)スペースを制御します。

コードは次のとおりです:

rrree

loop

スクロール数を設定します、loop=-1 の場合は、常にスクロールすることを意味します。 、デフォルトは -1 です

コードは次のとおりです:

<marquee vspace="100" bgcolor="#CCCCCC">hspace="100"</marquee>

scrolllamount

アクティブな字幕のスクロール速度をピクセル単位で設定します

コードは次のとおりです:

<marquee loop="-1" bgcolor="#CCCCCC">我会不停地走。</marquee>
<p> </p>
<marquee loop="2" bgcolor="#CCCCCC">我只走两次哦</marquee>

scrolllay

遅延を設定しますアクティブな字幕を 2 回スクロールする間の時間、単位はミリ秒 (ミリ秒) です

値が大きいほど、1 ステップと 1 回の一時停止の効果があります

コードは次のとおりです:

<marquee scrollamount="10" >scrollamount="10" </marquee>
<marquee scrollamount="20" >scrollamount="20" </marquee>
<marquee scrollamount="30" >scrollamount="30" </marquee>

上記は、HTML のマーキー属性の詳細な説明です。 phpの中国語サイトで紹介されていますので、皆さんのお役に立てれば幸いです。

関連記事:

marqueeの詳細な使用分析

HTMLのmarquee属性を賢く利用して、踊るテキストを実現

HTMLタグmarqueeに基づいてスクロール効果を実現する簡単な方法

以上がHTML のマーキー属性分析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。