Marquee 代码详解 + Marquee应用特效

天林

Marquee 在装修中主要制作滚动效果

先说一下Marquee的参数，温习一下

Marquee 标签常用的属性：

• align
  设定<marquee>标签内容的对齐方式
  absbottom：绝对底部对齐（与g、p等字母的最下端对齐）
  absmiddle：绝对中央对齐
  底线对齐
  bottom：底部对齐（默认）
  left：左对齐
  middle：中间对齐
  right：右对齐
  texttop：顶线对齐
  top：顶部对齐
  
  <marquee align="absbottom">align="absbottom"： 绝对底部对齐（与g、p等字母的最下端对齐）。 </marquee>
  <marquee align="absmiddle">align="absmiddle"： 绝对中央对齐。 </marquee>
  <marquee align=" line">align=" line"： 底线对齐。 </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
  设定活动字幕里所在的位置距离父容器水平边框的距离
  
    <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
  设定活动字幕里所在的位置距离父容器垂直边框的距离
  
  <marquee vspace="100" bgcolor="#CCCCCC">hspace="100"</marquee>
  
  loop
  设定滚动的次数，当loop=-1表示一直滚动下去，默认为-1
  
  <marquee loop="-1" bgcolor="#CCCCCC">我会不停地走。</marquee>
  <p> </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>
  
  ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
  现在就来实践一下
  大家在使用Marquee的时候都是只有一个Marquee吧，我们现在来用两个Marquee试试，效果还不错哦：
  
  <marquee behavior="alternate" height="120" direction="up" scrollamount="3" scrolldelay="30" width="100%" bgcolor="#3399FF">
  <marquee behavior="alternate" height="50" direction="left" scrollamount="3" scrolldelay="30" width="100%">
  <span style="font-size: 35px;color:#fff">天林网络=南粤数卡</span>
  </marquee>
  </marquee>
  
  效果展示请看我的店铺
  
  
  
  
  

幸福

必须地..研究研究研究哈

幸福

说实在的,看不懂..
说更实在..天林是偶像

忍者专卖店

抢抢抢....有事问你就好了..

看了社区的新规定..偶回来改下...支持下我们的林林同志..学习中..

花落无声

解释的真详细！学习了

Hello

楼主辛苦了！！！给你顶上

ωǒロ圭ロ塞

好厉害哦,呵

venuS

专业啊``
好想学会``

ˋ若记得。

学习学习