注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

天帅童子的博客

友好平台,相互交流,看中就拿!

 
 
 

日志

 
 

如何在背景图片上做滚动字幕  

2017-06-14 12:20:13|  分类: 我教你学 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

有一种友情默默无语,回眸时却已写满了期待;有一种友情无需表白,相逢相知的心灵已读懂彼此的情怀;有一种友情放在心里,珍藏心底的是生命中最深的关爱;有一种友情无尽思念,我的心载满对你的祝福,祝朋友;幸福一生,健康常伴,快乐永远。 能够相遇就是缘份,这份缘像小溪水,潺潺而来,涓涓而去,像柔柔的风,悄悄的来,轻轻的走,这份缘是自然的美,飘然相遇,静静相伴,慢慢诉说,愿我们珍惜缘,珍惜情,祝您快乐!

一】

 


动字幕的HTML最基本语法是:

  


<MARQUEE scrollAmount=2 scrollDelay=50 direction=up width=480 height=180 behavior=scroll>滚动文字</MARQUEE>

这是最原始,最简单,没有任何修饰的滚动,而要它能显示出各种不同的效果需要对其进行各种参数的设定,比如让大家看一下下面这段代码:


<MARQUEE style="color:#660099;font size=20" scrollAmount=2 scrollDelay=50 direction=up width=480 height=150 behavior=scroll>
<FONT color=blue><I>·欢迎来到快乐天使的博客</FONT></I><BR>
<FONT color=#660099 size=3>·<U>让我们大家互相交流</U></FONT><BR>
<FONT color=#990066 size=4 face=隶书>·建设良好的博客氛围,促进共同进步</FONT><BR>
<FONT color=#990033 size=3>·大家要及时美化博客,丰富博客<A href="http://www.blog.163.com/hxx2004.com" target=_blank>(点此进入逍遥居)</A></FONT><BR>
<FONT color=#990099 size=4><B>·丰富生活,让我们一起努力</B></FONT><BR>
<FONT color=blue face=华文行楷>·加油,我的朋友</FONT></MARQUEE>

效果如下:


·欢迎来到快乐天使的博客
·让我们大家互相交流
·建设良好的博客氛围,促进共同进步
·大家要及时美化博客,丰富博客(点此进入逍遥居)
·丰富生活,让我们一起努力
·加油,我的朋友

代码中各参数详解(请仔细看每行的代码和其相对应的显示效果):


  a)color:#660099;font size=20用来定义所有滚动字体的大小和颜色,如果要单独定义某行字体,则如代码中那样,在每句前后加<FONT color=#990066 size=4>和</FONT>,如果对字体的定义都是一样的,那么只要定义前面的了,后面的就不需要了。
  b)scrollAmount表示速度,值越大速度越快。如果没有它,默认为6,建议设为1~3比较好。
  c)scrollDelay也是用来控制速度的,表示走走停停,默认为90,值越大,速度越慢。通常scrollDelay是不需要设置的。
  d)direction很明显是表示滚动的方向,默认为从右向左:←,因此如果是向左滚动的话不需要次参数。其他可选的值还有right,down,up。滚动方向分别为:right表示→,up表示↑,down表示↓。
  e)width和height用来表示滚动区域的大小,width是宽度,height是高度。特别是在做垂直滚动的时候,一定要设height的值。
  f)bgcolor表示滚动区域的背景颜色,如果滚动文字不要背景的话把这段删了就可以了。
  g)behavior是来控制滚动属性的,默认为循环滚动(scroll),同样,如果是循环滚动的话可以不需要此参数。其他可选的值还有alternate(交替滚动),slide(幻灯片效果,指的是滚动一次,然后停止滚动)。
  h)如果要对文字进行超链接,只要在文字前后加<A href="链接地址" target=_blank>和</A>,如代码中所写的那样,target=_blank表示链接在新窗口中打开。
  i)每行字的前后<FONT color=#990066 size=4 face=隶书>和</FONT>用定义每行字的颜色,大小和字体,如果哪项不需要的话,把代码去掉就行。
  j)用WORLD编辑过东西的人都知道,<I>表示倾斜,<U>表示下划线,<B>表示加粗,加粗有可以是<STRONG>。
  k)<BR>表示换行。

补充:滚动字体特效中的各种参数不是单一的,而是可以随意组合的,比如下面这段代码的简单组合:


<MARQUEE scrollAmount=8 direction=up behavior=alternate height=80 width=499>
<MARQUEE scrollAmount=4 direction=right behavior=alternate height=50>
<font color=#990066 size=5 face=华文行楷>欢迎光临,祝大家快乐!</font></MARQUEE></MARQUEE>


欢迎光临,祝大家快乐!

插入文章背景图的代码是:

<DIV>
<TABLE width="500" border=0>
<TBODY>
<TR>
<TD background=背景图片地址 height=250>
<P>文章内容</P></TD></TR></TBODY></TABLE></DIV>

简单的滚动字幕代码是:

<MARQUEE scrollAmount=2 scrollDelay=50 direction=up width=200 height=200 behavior=scroll>要滚动的文字</MARQUEE>

其实在背景图片上做滚动字幕很简单,把那段滚动代码替代插入文章背景图代码中的“文章内容”几个字就可以了,代码如下所示。

<TABLE width="500" border=0>
<TBODY>
<TR>
<TD background=背景图片地址 height=250>
<P><MARQUEE scrollAmount=2 scrollDelay=50 direction=up width=200 height=200 behavior=scroll>要滚动的文字</MARQUEE></P></TD></TR></TBODY></TABLE></DIV>



欢迎光临逍遥居

欢迎光临逍遥居

欢迎光临逍遥居

欢迎光临逍遥居



如果让文字竖排滚动,代码如下:

<DIV>
<TABLE width="500" border=0>
<TBODY>
<TR>
<TD background=背景图片地址 height=250>
<P><MARQUEE scrollAmount=2 scrollDelay=50 direction=right width=200 height=200 behavior=scroll><DIV align=center>
<TABLE width="85%">
<TBODY>
<TR>
<TD vAlign=top width=10><FONT color=#cc3333 size=4>要竖排的字<BR></FONT></TD>
<TD vAlign=top width=10><FONT color=#cc3333 size=4>要竖排的字<BR></FONT></TD>
<TD vAlign=top width=10><FONT color=#cc3333 size=4>要竖排的字<BR></FONT></TD></TR></TBODY></TABLE></DIV></MARQUEE></P></TD></TR></TBODY

代码说明:红色部分为让文字竖排滚动的代码.



 

 

二】如何在背景图片上做滚动字幕

 

如何制作滚动字幕

/

图片

 

 

大漠孤烟的玩转

BLOG

上有提供滚动字幕代码,他的方法是教人们在

WORLD

编辑器里

编辑要滚动文字的显示效果的,

而现在我要额外补充一下教大家如何用代码来编辑字体大颜

色和大小,

其实原理都是一样的,源代码都是一样的,只是他的方法比较方便,快捷了点而

已,如果不会用代码的,建议用他的方法!

 

  

 

 

一、滚动字幕的

HTML

最基本语法是:

<MARQUEE>

要滚动的文字

</MARQUEE>

 

  

 

 

这是最原始,

最简单,

没有任何修饰的滚动,

而要它能显示出各种不同的效果需要对其

进行各种参数的设定,比如让大家看一下下面这段代码:

 

  

<MARQUEE style="color:#660099;font size=20" scrollAmount=2 scrollDelay=50 direction=up 

width=480 height=150 behavior=scroll> 

<FONT color=blue><I>

字幕

</FONT></I> 

</MARQUEE>

 

  

  

 

 

代码中各参数详解

(

请仔细看每行的代码和其相对应的显示效果

)

 

 

 

a)

color:#660099;font size=20

用来定义所有滚动字体的大小和颜色,如果要单独定义某

行字体,

则如代码中那样,

在每句前后加

<FONT color=#990066 size=4>

</FONT>

如果对

字体的定义都是一样的,那么只要定义前面的了,后面的就不需要了。

 

 

 

b)

scrollAmount

表示速度,值越大速度越快。如果没有它,默认为

6

,建议设为

1

3

较好。

 

 

 

c)

scrollDelay

也是用来控制速度的,表示走走停停,默认为

90

,值越大,速度越慢。通

scrollDelay

是不需要设置的。

 

 

 

d)

direction

很明显是表示滚动的方向,默认为从右向左:

,因此如果是向左滚动的话

不需要次参数。其他可选的值还有

right

down

up

。滚动方向分别为:

right

表示

up

down

表示

 

 

 

e)

width

height

用来表示滚动区域的大小,

width

是宽度,

height

是高度。特别是在做

垂直滚动的时候,一定要设

height

的值。

 

 

 

f)

bgcolor

表示滚动区域的背景颜色,如果滚动文字不要背景的话把这段删了就可以了。

 

 

 

g)

behavior

是来控制滚动属性的,默认为循环滚动

(scroll)

,同样,如果是循环滚动的话

可以不需要此参数。其他可选的值还有

alternate

(

交替滚动

)

slide

(

幻灯片效果,指的是滚动

一次,然后停止滚动

)

 

 

 

h)

如果要对文字进行超链接,只要在文字前后加

<A href="

链接地址

" target=_blank>

</A>

,如代码中所写的那样,

target=_blank

表示链接在新窗口中打开。

 

 

 

i)

每行字的前后

<FONT color=#990066 size=4 face=

隶书

>

</FONT>

用定义每行字的颜

色,大小和字体,如果哪项不需要的话,把代码去掉就行。

 

 

 

j)

WORLD

编辑过东西的人都知道,

<I>

表示倾斜,

<U>

表示下划线,

<B>

表示加粗,

加粗有可以是

<STRONG>

 

 

 

k)

<BR>

表示换行。

 



二】 有一种友情默默无语,回眸时却已写满了期待;有一种友情无需表白,相逢相知的心灵已读懂彼此的情怀;有一种友情放在心里,珍藏心底的是生命中最深的关爱;有一种友情无尽思念,我的心载满对你的祝福,祝朋友;幸福一生,健康常伴,快乐永远。 能够相遇就是缘份,这份缘像小溪水,潺潺而来,涓涓而去,像柔柔的风,悄悄的来,轻轻的走,这份缘是自然的美,飘然相遇,静静相伴,慢慢诉说,愿我们珍惜缘,珍惜情,祝您快乐!
  评论这张
 
阅读(18)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017