字体特效的源代码：（精品荟萃）_门主

字体特效的源代码：（精品荟萃）(2006-03-28 14:24:20)

下面是一些字体特殊效果的源代码，供大家参考：

★文章首字下沉特效：
<DIV style="FONT-SIZE: 12px; LINE-HEIGHT: 14px"><SPAN style="FONT-SIZE: 24px; LINE-HEIGHT: 28px; FLOAT: left;"><B>这</B></SPAN>
请在此填写文字内容，然后看效果！
</DIV>

★文章上下滚动的特效：
<MARQUEE scrollAmount=2 scrollDelay=200 direction=up width="100%" 
height=210><FONT style="LINE-HEIGHT: 180%; LETTER-SPACING: 3px" 
color=#ffffff>所要写的字</FONT></MARQUEE>

★做比较大的字代码
<FONT color=#09f7f7 size=7><STRONG><SUP><FONT color=#99ff00>ゞ要写的
字ゞ</FONT></SUP></FONT>

★文字走马灯效果代码
<marquee width="157" height="21">这里输入文字

★改变文字的字体和颜色代码1
<b><font face=华文行楷 size=5 color=#ff0000>要修改字体和颜色的字
提示：color=文章颜色

★改变文字的字体和颜色代码2
<FONT face=楷体_GB2312(字体) color=#0000ff(字体颜色) size=1>輸入文字</FONT>
提示：color=文章颜色

★移动文字代码
<marquee width="157" height="21">你要写的文字</marquee>

★文字特效显示代码
效果一：<CENTER><FONT style="COLOR: #e4dc9b; FILTER: shadow(color=black); 
FONT-FAMILY: 华文彩云; FONT-SIZE: 30pt; LINE-HEIGHT: 150%; WIDTH: 100%"><B>
欢迎光临博客精武门</B></FONT></CENTER>
效果二：<CENTER><FONT style="COLOR: #e4dc9b; FILTER: glow(color=black); 
FONT-FAMILY: 华文彩云; FONT-SIZE: 30pt; LINE-HEIGHT: 150%; WIDTH: 100%"><B>
欢迎光临博客精武门</B></FONT></CENTER>
效果三：<CENTER><FONT color=#0099ff style="FILTER: blur(add=1, 
direction=40,strength=10); FONT-SIZE: 30px; FONT-WEIGHT: bolder; POSITION: 
relative; LINE-HEIGHT: 150%; WIDTH: 450px">欢迎光临博客精武门
</FONT></CENTER>
效果四：<MARQUEE behavior=alternate direction=up height=150 
scrollAmount=5><MARQUEE behavior=altrnate scrollAmount=2 width=460 <IMG 
src="http://www.east128.com/bbs/UploadFile/2003-9/20039251018214901.gif"><F
ONT color=red face=楷体_gb2312 size=7>欢迎光临博客精武门
</FONT></MARQUEE></MARQUE></MARQUEE>
效果五：<FONT color=#0096ff face=隶书 size=7><MARQUEE height=50 width=240>
精武门</FONT></MARQUEE><FONT color=#0000ff face=隶书 size=7><MARQUEE 
direction=right height=50 width=240>门武精</MARQUEE></FONT></FONT>

★文字上下左右移动的特效代码
<marquee direction=移动方向 scrollamount=移动速度数值>插入文字</marquee> 
提示：direction=移动方向 可选值为向上(up) 向下(down) 向左(left) 向
右(right)

★文字停停走走效果代码
<marquee scrolldelay=500 scrollamount=100>插入文字</marquee>

★文字移动效果代码
<marquee behavior=移动效果>插入文字</marquee> 
说明：behavior=scroll 一圈一圈绕着走 behavior=slide 只走一次 
behavior=alternate 来回走

★发光文字代码
</textarea><table style="FILTER: glow(color=#6699FF,direction=2)">
<font color=#ffffff size=2>要填写的文字</font>
</table>
提示：color是阴影的颜色，可以配合网页色调改变，direction是设置阴影的强
度，font color是原字体的颜色

★浮雕效果的文字代码
</textarea><table style="FILTER: dropshadow(color=#6699FF, offx=1, offy=1, 
positive=1)；">
<font color=#ffffff>要填写的文字</font>
</table>
提示：color是阴影的颜色，可以配合网页色调改变，positive是设置阴影的强度，offx和offy是设置的阴影和文字的距离，color是原字体的颜色

★阴影文字的代码
</textarea><table style="FILTER: dropshadow(color=#cccccc, offx=2, offy=2, 
positive=2)；">
<font color=#6CABE7 size=2>要填写的文字</font>
</table>

★文本框字体代码
<DIV><TEXTAREA style="FONT: 12px ；font-family:Verdana；color:#666666; WIDTH: 490px; HEIGHT: 271px" rows=152 cols=612>要填写的文字&lt;/DIV&gt;</TEXTAREA></DIV>
提示：字体(font-family)还可以选用Arial,Tahoma等等；color可自行设定
<tr> 表格列 border="5"边框宽度为5像素，bordercolor="Purple"边框顔色为紫色<td> 表格栏 bgcolor="Green"表格背景顔色为绿色

★滚动字代码
<marquee border="0" align="middle" scrolldelay="120">要填写的文字</marquee>

★从右侧进来的字和图片代码
<DIV>
<TABLE cellSpacing=10 cellPadding=0 width="100%" border=0>
<TBODY>
<TR>
<TD vAlign=top width="100%">
<DIV align=center>
<MARQUEE scrollDelay=99 width="100%" height=108 border="0"><IMG 
src="http://www.smba-china.com/upload/upfile/2004430154320.gif"><FONT 
color=#b990f7><FONT face=华文行楷 color=#4d4dff size=7><B>博客精武门欢迎您</B><IMG src="http://www.smba
china.com/upload/upfile/2004430154320.gif"></FONT></FO
NT></MARQUEE></DIV></TD></TR></TBODY></TABLE></DIV>
<DIV>
<TABLE cellSpacing=10 cellPadding=0 width="100%" border=0>
<TBODY>
<TR>
<TD vAlign=top width="100%" height=118>
<DIV align=center><MARQUEE scrollDelay=99 width="100%" height=108 border="0"><IMG src="http://www.smba-china.com/upload/upfile/2004430154320.gif"><FONT 
color=#b990f7><FONT face=华文行楷 color=#4d4dff size=7><B>博客精武门欢迎您</B><IMG src="http://www.smba-china.com/upload/upfile/2004430154320.gif"></FONT></FO
NT></MARQUEE></DIV></TD></TR></TBODY></TABLE></DIV>

★倒帖的文字特效代码
<p align=right><FONT 
style="FONT-SIZE:50pt;filter:FlipH(color=silver);WIDTH:100%; 
COLOR:red;LINE-HEIGHT:150%;FONT-FAMILY:华文行楷"><B>博客精武门欢迎您</B></FONT></p>

★翻转文字特效代码
<FONT style="FONT-SIZE:50pt;filter:FlipV(color=silver);WIDTH:100%; 
COLOR:red;LINE-HEIGHT:150%;FONT-FAMILY:华文行楷"><B>博客精武门欢迎您</B></FONT>

★漂动文字特效代码
<table align=center border=3 bordercolor="#CD5C5C" width=450 height=350><td background=http://bbs.yunbbs.com/uploadFile/2004-12/20041210163350528.jpg><marquee behavior=alternate scrollamount=3 direction=down height=350><marquee behavior=alternate scrollamount=3 width=500><img src=1.gif><font color=red size=6><b>博客精武门欢迎您</b><img src=1.gif></font></marquee></table><br>

★漂的字特效代码
<P align=center>
<MARQUEE scrollAmount=12 direction=center behavior=alternate>
<MARQUEE direction=up behavior=alternate width=400 height=400>
<P align=center><IMG src="http://members12.tsukaeru.net/rose/0sozai/2cut/ico/50-01/s012.gif"><IMG src="http://www.cjhz.com/bbs/UploadFile/2004-10/20041016182848353.jpg"><IMG src="http://members12.tsukaeru.net/rose/0sozai/2cut/ico/50-01/s012.gif"></P><FONT style="FONT-SIZE: 30pt; FILTER: shadow(color=000000); WIDTH: 160%; 
COLOR: #4d4dff; LINE-HEIGHT: 150%; FONT-FAMILY: 华文彩云">博客精武门欢迎您</FONT></MARQUEE></MARQUEE></P>

★滚动字特效代码
<marquee width="200" height="100" direction="right" behavior="alternate" 
scrollamount="6" scrolldelay="88">博客精武门欢迎您</marquee>
提示说明：
scrollAmount 它表示速度，值越大速度越快。如果没有它，默认为6，建议设为1～3
比较好，width和height 表示滚动区域的大小，width是宽度，height是高度。特别是在做垂直滚动的时候，一定要设height的值，direction 表示滚动的方向，默认为从右向左：←。可选的值有right、down、up。滚动方向分别为：right表示→→，up表示↑，down表示↓scrollDelay 这也是用来控制速度的，默认为90，值越大，速度越慢。通常scrollDelay是不需要设置的，behavior用它来控制属性，默认为循环滚动，可选的值有alternate(交替滚动)、slide(幻灯片效果，指的是滚动一次，然后停止滚动)

★改变滚动字幕的颜色代码
<marquee scrollAmount=2 width=300><a style=color:CC6600>博客精武门欢迎您</a></marquee>

★当鼠标停留在文字上，文字停止滚动代码
<marquee scrollAmount=2 width=300 onmouseover=stop() onmouseout=start()>博客精武门欢迎您</marquee>

★文字交替效果特效代码
<marquee scrollAmount=2 width=150 behavior=alternate>博客精武门/marquee>

★多行文本向上滚动特效代码
<marquee scrollAmount=2 width=300 height=50 direction=up>·博客精武门<br>·博客精武门<br><a href=http://www.hack58.com>博客精武门</a></marquee>

★不停变化颜色的字代码
<DIV id=texture style="WIDTH: 460px; HEIGHT:30px"><IMG height=2 
src="/web/ewebeditor/UploadFile/2005101692624157.gif" width=460px 
align=right><IMG height=30px src="/web/ewebeditor/UploadFile/2005101692625359.gif" width=446.2px 
align=right><DIV style="FONT-SIZE: 20px; FILTER: Chroma(color=#FCFBFA); 
FLOAT: left; WIDTH: 460px; HEIGHT:30px; BACKGROUND-COLOR:#000000" 
align=center><FONT color=#FCFBFA>博客精武门</FONT></DIV></DIV>

★带框文字特效代码
<font color=#02B452 
style="border-color=#FF0000;border-top-style:outset;border-bottom-style:out
set;border-right-style:outset;border-left-style:outset">修改你要的字</font>
提示：这些符号是边框类型(修改代码中可修改,不过建议上下左右边框用同一种效果)
double 表示边框样式为：双线
groove 表示边框样式为：3D凹槽状
dotted 表示边框样式为：点线 
inset 表示边框样式为：3D内嵌边框
outset 表示边框样式为：3D外嵌边框
ridge 表示边框样式为：3D凸脊状
dashed 表示边框样式为：虚线
solid 表示边框样式为：实线

★滚动红色字特效代码
<marquee width="650" height="60"><font color="red">博客精武门欢迎您</font></a></marquee>

★滚动无框红色字特效代码
<div id="layer25" style="padding:0px; LEFT: 2px; OVERFLOW: hidden; WIDTH: 
634px; POSITION: absolute; TOP: 0px; HEIGHT: 530px; zindex: 90" 
resiziable="true"><marquee width="750" height="60"><font color="red">博客精武门欢迎您</font></a></marquee>

★左右移动字特效代码
<font colo*=#855558><center><marquee behavior="alternate" 
scrollamount="2">博客精武门欢迎您</marquee></marquee></font></center>

★角度跳动的字左右移动字特效代码
<marquee behavior="alternate" direction="up" height="80" width="60%" 
scrollamount="2" scrolldelay="0"><marquee behavior="alternate" 
scrollamount="3">博客精武门欢迎您</marquee></marquee>

★七字体顔色文字特效代码
<font COLOR=颜色代码>文字</font>

★修改导航,但还是原来的格式,但是改变字体和背景代码
<img src="/blog/javascript:bt_1.innerText="导航文字;';bt_2.innerText='导航
文字';bt_3.innerText='导航文字';bt_4.innerText='导航文字';bt_5.innerText='
导航文字';bt_6.innerText='导航文字';bt_7.innerText='导航文
字';bt_8.innerText='导航文字';">
在加上透明效果:
<img 
src="/blog/javascript:bt_1.style.background="url()';bt_2.style.background='
url()';bt_3.style.background='url()';bt_4.style.background='url()';bt_5.sty
le.background='url()';bt_6.style.background='url()';bt_7.style.background='
url()';bt_8.style.background='url()';"></img>
在加上颜色效果: 
<img 
src="javascript:document.getElementById('bt_1').style.color='#D9D919';docum
ent.getElementById('bt_2').style.color='#FF00FF';document.getElementById('b
t_3').style.color='#FFFFFF';document.getElementById('bt_4').style.color='#3
3ff00';document.getElementById('bt_5').style.color='#FF7F00';document.getEl
ementById('bt_6').style.color='#FF0000';document.getElementById('bt_7').sty
le.color='#00ffff';document.getElementById('bt_8').style.color='#77aaff';">
</img><font color=red></font>

点击此处获取颜色代码：点击此处开始自己调配颜色：

文章引用自：精武门主

阅读|评论|收藏|打印|举报

前一篇：博客大背景素材（精美图片）
后一篇：感谢博友们

评论重要提示：警惕虚假中奖信息，点击查看详情[发评论]

评论加载中，请稍候...

发评论 明星私家相册

插入表情

登录名：
密码：
找回密码
注册
昵称：
匿名评论

验证码： 看不清楚数字吗？点击这里再试试。收听验证码

发评论

以上网友发言只代表其个人观点，不代表新浪网的观点或立场。