滚动字幕特效大全

最新推荐文章于 2021-05-08 15:16:41 发布
最新推荐文章于 2021-05-08 15:16:41 发布
阅读量1.5k 收藏
点赞数
分类专栏： WEB 文章标签： behavior filter div scroll up 360
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zhongguoren666/article/details/7011660
版权

 

1.阴影滚动字

循环滚动:

欢迎来到小海空间

代码:

<marquee scrollamount=3 FONT style="COLOR=FF0000; FILTER: shadow(color=FFFF33 ); FONT-FAMILY: 隶书; FONT-SIZE: 25pt; WIDTH: 100%">欢迎来到小海空间</marquee>

来回移动:

欢迎来到小海空间

 代码:

<marquee behavior="alternate" scrollamount=2 FONT style="COLOR=3300FF; FILTER: shadow(color=33FFFF ); FONT-FAMILY: 隶书; FONT-SIZE: 25pt; WIDTH: 100%">欢迎来到小海空间</MARQUEE>

2.投射阴影滚动字

循环滚动:

小海欢迎你

代码:

<marquee scrollamount=3 font style="FILTER: Shadow(color=#660099,direction=135); HEIGHT: 10pt;font-size:25pt" face="隶书" color=#009900>小海欢迎你</font></marquee>

来回移动:

小海欢迎你

代码:

<marquee scrollamount=3 behavior=alternate font style="FILTER: Shadow(color=#660099,direction=135); HEIGHT: 10pt;font-size:25pt" face="隶书" color=#009900>小海欢迎你</font></marquee>

3.发光滚动字

循环滚动:

小海欢迎你

代码:

<marquee scrollamount=3 FONT style="COLOR: #0033CC; FILTER: glow(color=FFFF66); FONT-FAMILY: 华文彩云; FONT-SIZE: 20pt; WIDTH: 100%"><B>小海欢迎你</B></FONT></marquee>

来回移动:

小海欢迎你

代码:

<marquee scrollamount=3 behavior=alternate FONT style="COLOR: #0033CC; FILTER: glow(color=FFFF66); FONT-FAMILY: 华文彩云; FONT-SIZE: 20pt; WIDTH: 100%"><B>小海欢迎你</B></FONT></marquee>

4.若隐若现滚动字

循环滚动:

小海欢迎你

代码:

<MARQUEE style="FONT-SIZE: 30pt; FILTER: alpha(opacity=100,style=3); WIDTH: 100%; COLOR: red; LINE-HEIGHT: 100%; FONT-FAMILY: 华文行楷" scrollAmount=3 FONT><B>小海欢迎你</B></FONT></MARQUEE>

来回移动:

小海欢迎你

代码:

<MARQUEE behavior=alternate style="FONT-SIZE: 30pt; FILTER: alpha(opacity=100,style=3); WIDTH: 100%; COLOR: red; LINE-HEIGHT: 100%; FONT-FAMILY: 华文行楷" scrollAmount=3 FONT><B>小海欢迎你</B></FONT></MARQUEE>

本代码属性分析:

opacity：设置透明度，取值0至100之间的任意数值，100表示完全不透明；
style：设置渐变风格，0表示均匀渐变，1表示线性渐变，2表示放射渐变，3表示直角渐变；
width：100%则表示参与渐变的对象的宽度，通常都设置为100%。

5.清晰阴影滚动字

循环滚动:

小海欢迎你

代码:

<marquee scrollamount=3 FONT style="FONT-SIZE: 20pt; FILTER: dropshadow(color=#228B22,offX=5,offY=3,Positive=1); WIDTH: 100%; COLOR: #ff7f50; LINE-HEIGHT: 150%; FONT-FAMILY: 华文行楷"><B>小海欢迎你</B></FONT></marquee>

来回移动:

小海欢迎你

代码:

<marquee scrollamount=3 behavior=alternate FONT style="FONT-SIZE: 20pt; FILTER: dropshadow(color=#228B22,offX=5,offY=3,Positive=1); WIDTH: 100%; COLOR: #ff7f50; LINE-HEIGHT: 150%; FONT-FAMILY: 华文行楷"><B>小海欢迎你</B></FONT></marquee>

6.波纹效果滚动字

循环滚动:

小海欢迎你

代码:

<marquee scrollamount=3 FONT style="FONT-SIZE: 30pt; FILTER: wave(add=0,lightstrength=50,strength=3,freq=2,phrase=10); WIDTH: 100%; COLOR: red; LINE-HEIGHT: 100%; FONT-FAMILY: 华文行楷"><B>小海欢迎你</B></FONT></marquee>

来回移动:

小海欢迎你

代码:

<marquee scrollamount=3 behavior=alternate FONT style="FONT-SIZE: 30pt; FILTER: wave(add=0,lightstrength=50,strength=3,freq=2,phrase=10); WIDTH: 100%; COLOR: red; LINE-HEIGHT: 100%; FONT-FAMILY: 华文行楷"><B>小海欢迎你</B></FONT></marquee>

本代码属性分析:

add：波纹型，0或1，0表示将原始对象加入最后效果中，1则反之；
freq：决定显示的频率，即应出现多少个波形；
phrase：决定波形的形状，值取0至360之间；
strength：决定波形的振幅

7.立体滚动字

循环滚动:

小海欢迎你

代码:

<marquee scrollamount=3 FONT style="FONT-SIZE: 30pt; FILTER: shadow(color=#AF0530); WIDTH: 100%; COLOR: #f90b46; LINE-HEIGHT: 150%; FONT-FAMILY: 隶书"><B>小海欢迎你</B></FONT></marquee>

来回移动:

小海欢迎你

代码:

<marquee scrollamount=3 behavior=alternate FONT style="FONT-SIZE: 30pt; FILTER: shadow(color=#AF0530); WIDTH: 100%; COLOR: #f90b46; LINE-HEIGHT: 150%; FONT-FAMILY: 隶书"><B>小海欢迎你</B></FONT></marquee>

8.金属滚动字

循环滚动:

小海欢迎你

代码:

<marquee scrollamount=3 FONT style="FONT-SIZE: 30pt; FILTER: glow(color=black); WIDTH: 100%; COLOR: #e4dc9b; LINE-HEIGHT: 150%; FONT-FAMILY: 华文彩云"><B>小海欢迎你</B></FONT>
</marquee>

来回移动:

小海欢迎你

代码:

<marquee scrollamount=3 behavior="alternate" FONT style="FONT-SIZE: 30pt; FILTER: glow(color=black); WIDTH: 100%; COLOR: #e4dc9b; LINE-HEIGHT: 150%; FONT-FAMILY: 华文彩云"><B>小海欢迎你</B></FONT>
</marquee>

9.空心金属滚动字

循环滚动:

小海欢迎你

代码:

<marquee scrollamount=3 FONT style="FONT-SIZE: 30pt; FILTER: shadow(color=black); WIDTH: 100%; COLOR: #e4dc9b; LINE-HEIGHT: 150%; FONT-FAMILY: 华文彩云"><B>小海欢迎你</B></marquee>

来回移动:

小海欢迎你

代码:

<marquee scrollamount=3 behavior="alternate" FONT style="FONT-SIZE: 30pt; FILTER: shadow(color=black); WIDTH: 100%; COLOR: #e4dc9b; LINE-HEIGHT: 150%; FONT-FAMILY: 华文彩云"><B>小海欢迎你</B></marquee>

10.凹凸投影滚动字

循环滚动：

小海欢迎你

代码：

<marquee scrollamount=3 FONT style="FONT-SIZE: 40pt; FILTER: shadow(color=green); WIDTH: 100%; COLOR: white; LINE-HEIGHT: 150%; FONT-FAMILY: 华文彩云"><B>小海欢迎你</B></FONT></marquee>

来回移动：

小海欢迎你

代码：

<marquee behavior="alternate" scrollamount=3 FONT style="FONT-SIZE: 40pt; FILTER: shadow(color=green); WIDTH: 100%; COLOR: white; LINE-HEIGHT: 150%; FONT-FAMILY: 华文彩云"><B>小海欢迎你</B></FONT></marquee>

11.空心滚动字

循环滚动: 

小海欢迎你

代码:

<marquee scrollamount=3 FONT style="FONT-SIZE: 40pt; FILTER: shadow(color=black); WIDTH: 100%; COLOR: #cc0033; LINE-HEIGHT: 150%; FONT-FAMILY: 华文彩云"><B>小海欢迎你</B></FONT>

来回移动:

小海欢迎你

代码:

<marquee behavior=alternate scrollamount=3 FONT style="FONT-SIZE: 40pt; FILTER: shadow(color=black); WIDTH: 100%; COLOR: #cc0033; LINE-HEIGHT: 150%; FONT-FAMILY: 华文彩云"><B>小海欢迎你</B></FONT>

12.毛绒滚动字

循环滚动:

小海欢迎你

代码:

<marquee scrollamount=3 SPAN style="DISPLAY: block; FONT-SIZE: 30pt; FILTER: glow(color=red,strength=10); COLOR: blue; HEIGHT: 1px; TEXT-ALIGN: center">小海欢迎你</SPAN>

来回移动:

小海欢迎你

代码:

<marquee scrollamount=3 behavior="alternate" SPAN style="DISPLAY: block; FONT-SIZE: 30pt; FILTER: glow(color=red,strength=10); COLOR: blue; HEIGHT: 1px; TEXT-ALIGN: center">小海欢迎你</SPAN>

13.描边中空抛射滚动字

循环滚动:

小海欢迎您

代码:

<marquee scrollamount=3 DIV style="FILTER: shadow(color=#3300FF, strength=8); WIDTH: 490px"><FONT style="FONT-WEIGHT: normal; FONT-SIZE: 40pt; LINE-HEIGHT: normal; FONT-STYLE: normal; FONT-VARIANT: normal" face=华文彩云 color=#33ffff>小海欢迎您</FONT> <BR></DIV>

来回移动:

小海欢迎您

代码:

<marquee scrollamount=3 behavior="alternate" DIV style="FILTER: shadow(color=#3300FF, strength=8); WIDTH: 490px"><FONT style="FONT-WEIGHT: normal; FONT-SIZE: 40pt; LINE-HEIGHT: normal; FONT-STYLE: normal; FONT-VARIANT: normal" face=华文彩云 color=#33ffff>小海欢迎您</FONT> <BR></DIV>

14.投影滚动字

循环滚动:

小海欢迎你

代码:

<marquee scrollamount=3 SPAN style="DISPLAY: block; FONT-SIZE: 30pt; FILTER: blur(add=t,direction=135,strength=10); COLOR: darkblue; HEIGHT: 1px; TEXT-ALIGN: center">小海欢迎你</SPAN>

来回移动:

小海欢迎你

代码:

<marquee scrollamount=3 behavior="alternate" SPAN style="DISPLAY: block; FONT-SIZE: 30pt; FILTER: blur(add=t,direction=135,strength=10); COLOR: darkblue; HEIGHT: 1px; TEXT-ALIGN: center">小海欢迎你</SPAN>

15.波浪滚动字

循环滚动:

小海欢迎你

代码:

<marquee scrollamount=3 span style="font-size:30pt;display:block;text-align:center;color:darkblue;filter:wave(add=t,freq=5,lightstrength=5,phase=0,strength=5);height:1">小海欢迎你</span>
来回移动:

小海欢迎你

代码:

<marquee scrollamount=3 behavior="alternate" span style="font-size:30pt;display:block;text-align:center;color:darkblue;filter:wave(add=t,freq=5,lightstrength=5,phase=0,strength=5);height:1">小海欢迎你</span>

16.阴影滚动字

循环滚动:

小海欢迎你

代码:

<marquee scrollamount=3 span style="font-size:30pt;display:block;text-align:center;color:darkblue;filter:shadow(color=blue);height:1">小海欢迎你</span>

来回移动:

小海欢迎你

代码:

<MARQUEE style="DISPLAY: block; FONT-SIZE: 30pt; FILTER: shadow(color=blue); COLOR: darkblue; HEIGHT: 1px; TEXT-ALIGN: center" scrollAmount=3 behavior=alternate span>小海欢迎你</SPAN></MARQUEE>

17.重叠文字滚动

循环滚动:

小海欢迎你

代码:

<marquee scrollamount=3 div align="center" style="height:1;font-size:30pt;filter:dropshadow(color=maroon,positive=1);">小海欢迎你</div>

来回移动:

小海欢迎你

代码:

<marquee scrollamount=3 behavior=alternate  div align="center" style="height:1;font-size:30pt;filter:dropshadow(color=maroon,positive=1);">小海欢迎你</div>

18.竖排文字滚动

 

我的心除了你还有谁
可为何却在半路出了轨
我们的爱像潮水
放纵之后化成灰
面对面又如何去面对
我的心除了你不再有谁
却背叛了开在心里的玫瑰
我们的爱像潮水
放纵之后收不回
这辈子来不及向你忏悔

请不要离开我
在这下雨的时候
请不要离开我
当我独自喝醉在街头
请不要离开我
绝不放开你的手
哭的时候让泪往心里流
请不要离开我
在这下雨的时候
请不要离开我
当我独自喝醉在街头
请不要离开我
绝不放开你的手
哭的时候让泪往心里流
 
代码:
<DIV align=center>
<MARQUEE scrollAmount=1 scrollDelay=100 behavior=slide loop=1 width=480 height=150>
<MARQUEE style="LINE-HEIGHT: 150%; WRITING-MODE: tb-rl" scrollAmount=1 scrollDelay=100 direction=up width=480 height=220>
<P align=left><FONT style="FONT-SIZE: 15pt; FILTER: WIDTH: 100%; COLOR: red ; LINE-HEIGHT: 150%; FONT-FAMILY: 隶书" color=red> 我的心除了你还有谁<BR> 可为何却在半路出了轨<BR> 我们的爱像潮水<BR> 放纵之后化成灰<BR> 面对面又如何去面对<BR> 我的心除了你不再有谁<BR> 却背叛了开在心里的玫瑰<BR> 我们的爱像潮水<BR> 放纵之后收不回<BR> 这辈子来不及向你忏悔<BR><BR> 请不要离开我<BR> 在这下雨的时候 <BR> 请不要离开我<BR> 当我独自喝醉在街头<BR> 请不要离开我<BR> 绝不放开你的手<BR> 哭的时候让泪往心里流<BR> 请不要离开我<BR> 在这下雨的时候 <BR> 请不要离开我<BR> 当我独自喝醉在街头<BR> 请不要离开我<BR> 绝不放开你的手<BR> 哭的时候让泪往心里流<BR></FONT></P></MARQUEE></MARQUEE></DIV>
 
本页代码基本综合属性分析:

color=66FF33    颜色代码  可参见颜色代码大全更改颜色

size=2     字体大小代码 更改数值改变字体大小

FONT-SIZE: 30pt   字体大小代码 更改数值改变字体大小

FONT-FAMILY: 华文行楷      字体代码  改变字体描述更改字体

scrollamount=3:   移动速度代码 可改变数值来控制文字的滚动速度

behavior="alternate":     来回移动代码

marquee direction=移动方向

可选值为向上(up)　向下(down)　向左(left)　向右(right)
behavior=scroll   一圈一圈绕着走　
behavior=slide   只走一次

behavior=alternate来回走
<marquee scrolldelay=500 scrollamount=100>插入文字</marquee>  停停走走


 

zhongguoren666
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
ASS字幕特效代码
08-27
Aegisub教程 感覺寫的不夠完善如有意見歡迎提出template line只是其中一種功能其他還在摸索中...相關原理在Aegisub的說明書中有教
marquee参数详解
Welcome to here !
06-15 8955
2008-04-25 09:51（文字滚动）参数详解 文字滚动是由控制的。marquee的参数如下： 1、方向 #=left, right 如：啦啦啦，我从右向左移！ 啦啦啦，我从左向右移！ 2、方式 #=scroll, slide, alternate 如：啦啦啦，我一圈一圈绕着走！ 啦啦啦，我只走一次就歇了！ 啦啦啦，我来回走耶！ 3、循环 #=次数；...
HTML之marquee(文字滚动)详解
dddp75921的博客
10-20 625
语法： <marquee></marquee> 以下是一个最简单的例子： 代码如下: <marquee><font size=+3 color=red>Hello, World</font></marquee> 下面这两个事件经常用到： onMouseOut="this.start()" ：用来设置鼠标移...
【Web】CSS3实现文字滚动公告效果
ns2250225
04-03 2万+
代码<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge">
HTML如何实现滚动文字
m0_52813455的博客
05-08 1万+
一、HTML滚动文字 marquee 滚动文字标签 在一个页面中会有很多多媒体元素，比如动态文字、动态图象、音视频等，而最简单的就是天价滚动文字了，在HTML中，如果我们想要添加滚动文字，需要使用marquee标签。 我们先来看一下最简单的示例： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>marquee</title>
html中Marquee属性详解(滚动显示文本/图片)
鄢潆
08-19 9613
align:    对齐方式 LEFT，CENTER，RIGHT，TOP，BOTTOM (不用多说了)behavior:    用于设定滚动的方式，主要由三种方式：behavior="scroll":    表示由一端滚动到另一端；behavior="slide":    表示由一端快速滑动到另一端，且不再重复；behavior="alternate" :    默认值——表示在两端之间来回滚动。
多种方式实现字幕滚动效果
wangle_style的博客
04-21 4091
1.html5有marquee标签来直接实现字幕的滚动效果       onMouseOut="this.start()" width="100%" height="100px" align="right">                                 111111111111                   222222222222222          
滚动字幕特效大全代码 (转)
weixin_30338497的博客
05-26 2184
滚动字幕特效大全代码 把代码中的文字改为你的文字就可以了。 1.阴影滚动字 循环滚动: 欢迎来到农夫空间 代码: <marqueescrollamount=3 FONT style="COLOR=FF0000; FILTER: shadow(color=FFFF33 ); FONT-FAMILY: 隶书; FONT-SIZE: 25pt; WIDTH: 10...
滚动文字Marquee属性及参数设置
weixin_30443731的博客
10-30 400
滚动字幕Marquee代码大全 基本语法 ------------------------------------------- <marquee>滚动文字 </marquee> 文字移动属性的设置 方向 <direction=#> #=left, right,up,down <marquee direction=left>从右向左移！...
mouseover时显示滚动字幕 特效
10-31
mouseover时显示滚动字幕 特效
C#实现滚动字幕特效
01-30
C#实现滚动字幕特效,C#实现滚动字幕特效
电影左右滚动字幕特效ppt模板.rar
09-07
电影左右滚动字幕特效ppt模板
VS2010创建Webservice程序
热门推荐
踏雪无痕
01-30 3万+
在Visual Studio 2010中已经找不到直接创建WebService的模板方式了，但下面的方法可心实现：    在 Visual Studio 2010 的新建 Web 应用程序或者 Web 网站窗口中，如果你选择 .NET 4.0，会发现缺少了 ASP.NET Web Services 模板。你可能会怀疑 VS 2010 是不是不支持 ASP.NET Web Services 了？答
HTTP/1.1 500 Internal Server Error"
踏雪无痕
08-24 1万+
错误的行为：     在VS.net 2003中创建一项ASP.NET Web 应用程序,此时发生错误:  尝试创建Web项目或打开位于URL"http://localhost/WebApplication1"的Web项目时,Web服务器报告了以下错误。"HTTP/1.1 50
iis打开aspx文件时显示无法找到该页
踏雪无痕
02-27 6692
iis 里 html 和 asp 的页面访问都正常，aspx 页面总是报无法找到该页。 前一阵子机器折腾的比较多：公司禁用安全360，说360跟一些公司自身监控之类有冲突，把360卸载，禁用了不少服务。有同事说，framework 4.0 会导致 iis 无法识别 aspx 页面，尝试卸载 vs2010 的beta版。由于是在线安装，本机没有安装程序，控制面板里还卸载不掉。直接删的文件和
解决WebService部署时出现的“未能创建类型...”错误
踏雪无痕
02-27 6185
这几天正在学习WebService，但是在部署时老是出现“未能创建类型...”的错误，在IIS7.0下折腾了半天，终于成功部署，现将经验向大家奉上。      首先必须先在IIS在创建一个虚拟目录（这个就不用多说了吧），如果这个时候直接在浏览器里调用WebService就会出现上述错误。原因是必须为上面创建的虚拟目录创建单独的应用程序，方法是右击虚拟目录，点击“添加应用程序...”，目录
HTML5-WebSocket实现对服务器CPU实时监控
踏雪无痕
12-28 5705
由于WebSocket允许保持长连接,因此当建立连接后服务器可以主动地向Client发送相关信息.下面通过服务端获取当前CPU的使用情况主动发送给网页,让网页实时显示CPU使用情况的曲线图.该事例的主要功能是包括服务端获取CPU使和情况和HTML5使用canvas进行曲线图绘制. 应用效果 实现效果主要是模仿windows的任务管理器,显示每个核的工作情况. C#获取CPU使用情况 可
delphi滚动字幕
最新发布
08-19
Delphi是一种编程语言和开发环境，能够用于创建各种类型的应用程序，包括滚动字幕。滚动字幕是一种以持续滚动的方式显示信息的文本效果。下面让我详细介绍一下如何使用Delphi来实现滚动字幕。 在Delphi中，我们可以使用TLabel控件来实现滚动字幕效果。首先，需要在窗体上放置一个TLabel控件，并设置其属性来适应滚动字幕的需求。比如，将Label的AutoSize属性设置为False，将其Width属性设置为窗体的宽度。这样，Label就能够在窗体上水平滚动显示文本了。 接下来，我们需要使用定时器来控制滚动字幕的速度。在Delphi中，我们可以使用TTimer组件来实现定时器功能。我们需要将TTimer的Interval属性设置为一个适当的值，控制滚动字幕的速度。然后，在TTimer的OnTimer事件中，可以编写代码来实现滚动字幕的效果。 在OnTimer事件中，我们可以通过调整Label的Left属性来实现滚动字幕的效果。通过每次将Label的Left属性减小一个固定值，就能够使Label向左滚动。当Label的Left属性减小到一定值后，我们可以将其重置为窗体的宽度，实现循环滚动的效果。 此外，我们还可以通过设置Label的字体、颜色等属性来定制滚动字幕的外观。比如，可以设置Label的Font属性来改变字体样式，设置Label的Color属性来改变背景颜色，以及设置Label的Caption属性来显示滚动的文本内容。 总的来说，使用Delphi实现滚动字幕是相对简单的。通过合理设置Label和TTimer的属性，并在OnTimer事件中编写代码来控制滚动效果，即可实现一个滚动字幕的效果。当然，我们还可以进一步定制滚动字幕的外观和实现其他的功能，这需要根据具体的需求和编程技巧来实现。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值