玩玩文字特效^▽^

2008060716:00

蒐集：網頁製作教學 2007/12/17 19:08

下面介紹的文字特效部分特效部落格中並不支援~如跑馬燈類須作成網頁內坎入部落格才可呈現

文字特效語法

　

加菲貓 文字特效語法來源→ 加菲貓 加菲貓

　

改變字的
大小顏色

語法：

<font size="字的大小" color="#色碼">輸入你要的字</font>

範例：

<font size="5" color="#ffff00">你會了嗎</font>

結果：

你會了嗎

說明：

"色碼"可到網頁的顏色數碼區那找到

變色文字

語法：

<img src= width=0 height=0 onerror="setInterval('font.style.color=Math.random()*255*255*255',500)"><font id="font">輸入你要出現的字</font>

範例：

<img src= width=0 height=0 onerror="setInterval('font.style.color=Math.random()*255*255*255',500)"><font id="font">你看到字體在變色的效果了嗎</font>

結果：

 你看到字體在變色的效果了嗎

立體文字

語法：

<div style="FILTER: shadow(color=陰影色碼); WIDTH: 460px; HEIGHT: 30px"><FONT color=#文字色碼 size=文字大小>輸入你要寫的字</div></font>

範例：

<div style="FILTER: shadow(color=00aa00); WIDTH: 460px; HEIGHT: 30px"><FONT color=#ffff00 size=4>看到了嗎是不是不一樣了</div></font>

結果：
看到了嗎是不是不一樣了

發亮文字

語法：

<font color=字體顏色 size=字體大小 face=字體 style=width:100%;filter:glow(color=陰影顏色)>輸入你要出現的字</font>

範例：

<font color=ffffff size=4 face=標楷體 style=width:100%;filter:glow(color=0066ff)>歡迎光臨 加菲貓的家</font>

結果：

 歡迎光臨加菲貓的家

底色文字

語法：

<font style=width:100%;filter:glow(color=底色,strength=50)><center>輸入你要出現的字</center></font>

範例：

<font style=width:100%;filter:glow(color=#8080ff,strength=50)><center>加菲貓</center></font>

結果：

加菲貓

圖片文字

語法：

 <TABLE height=圖片高度 width=圖片寬度 align=center background=圖片網址 border=6> <TD style="FILTER: glow(strength=1)mask(color=#B4BBCF)chroma(color=#B4BBCF)" align=middle height=54><FONT face=MingLiU color=#8c96b5 size=6><B><I>輸入你要出現的字</I></B></FONT></TD></TABLE>
範例： <TABLE height=170 width=420 align=center background=http://i121.photobucket.com/albums/o209/zz2006/swf/001.jpg border=6> <TD style="FILTER: glow(strength=1)mask(color=#B4BBCF)chroma(color=#B4BBCF)" align=middle height=54><FONT face=MingLiU color=#8c96b5 size=6><B><I>★加菲貓★</I></B></FONT></TD></TABLE>

結果：

★加菲貓★
　

跑馬燈
(由右向左)

語法：

<marquee>輸入你要寫的字</marquee>

範例：

<marquee>這樣子你明白了嗎</marquee>

結果：

 這樣子你明白了嗎

跑馬燈
(由左向右)

語法：

<marquee direction="right;>輸入你要寫的字</marquee>

範例：

<marquee direction="right">這樣子你明白了嗎</marquee>

結果：

 這樣子你明白了嗎

跑馬燈
(交替)
來回跑

語法：

<marquee behavior="alternate">輸入你要寫入的字</marquee>

範例：

<marquee behavior="alternate">跑馬燈都會了吧</marquee>

結果：

 跑馬燈都會了吧

跑馬燈
(合併)

語法：

<marquee direction=right width=88 height="16">輸入左邊出現的字</marquee><marquee direction=left width=86 height="16">輸入左邊出現的字</marquee>

範例：

<marquee direction=right width=88 height="16">這是左邊文字</marquee><marquee direction=left width=86 height="16">這是右邊文字</marquee>

結果：

 這是左邊文字 這是右邊文字

字往上移

語法：

<MARQUEE scrollAmount=字跑的速度 direction=up>輸入你要寫的字</MARQUEE>

範例：

<MARQUEE scrollAmount=1 direction=up>這是第一行<p>這是第二行</MARQUEE>

結果：

 這是第一行

這是第二行

說明：

字與字間可以使用<br>換行，換空一行可用<p>將up改成down即是字由上往下

字往上移
模糊背景

語法：

<MARQUEE style="FONT-SIZE: 13pt; FILTER: Alpha(Opacity=200, <br>FinishOpacity=0,Style=2,StartX=150, StartY=150, FinishX=0, FinishY=0); WIDTH: 寬度px; COLOR: blue; FONT-FAMILY: 標楷體; HEIGHT: 高度px; TEXT-ALIGN: center" scrollAmount=2 scrollDelay=100 direction=up width=528 bgColor=背景顏色 height=390 align="middle" border="0">輸入你要出現的字

範例：

<MARQUEE style="FONT-SIZE: 13pt; FILTER: Alpha(Opacity=200, <br>FinishOpacity=0,Style=2,StartX=150, StartY=150, FinishX=0, FinishY=0); WIDTH: 528px; COLOR: blue; FONT-FAMILY: 標楷體; HEIGHT: 390px; TEXT-ALIGN: center" scrollAmount=2 scrollDelay=100 direction=up width=528 bgColor=#9FC800 height=390 align="middle" border="0">這是第一行<p>這是第二行</MARQUEE>

結果：

 這是第一行

這是第二行

飄動的字

語法：

<marquee><marquee direction=up behavior=alternate width=400 height=100>打上你要出現的字</marquee></marquee>

範例：

<marquee><marquee direction=up behavior=alternate width=400 height=100>看到我了嗎</marquee></marquee>

結果：

 看到我了嗎

上下擺動

語法：

<font size="字體大小" face=字體 color="字體顏色">
<marquee direction=up behavior=alternate width=寬度 height=擺動的高度>輸</marquee>

範例：

<font size="4" face=標楷體 color="//#ff0000"> <marquee direction=up behavior=alternate width=40 height=100>輸</marquee> <marquee direction=up behavior=alternate width=40 height=80>入</marquee> <marquee direction=up behavior=alternate width=40 height=70>你</marquee> <marquee direction=up behavior=alternate width=40 height=60>要</marquee> <marquee direction=up behavior=alternate width=40 height=70>出</marquee> <marquee direction=up behavior=alternate width=40 height=85>現</marquee> <marquee direction=up behavior=alternate width=40 height=100>字</marquee></FONT>

結果：

 輸 入 你 要 出 現 字

　

說明：

每增加一行就可增加一個字的擺動

飄落文字

語法：

<marquee scrollamount=3 direction="down" width=60 height=80><font size=5 color=#788aff>水</font></marquee><marquee scrollamount=4 direction="down" width=60 height=80><font size=5 color=#788aff >水</font></marquee> <marquee scrollamount=5 direction="down" width=60 height=80><font size=5 color=#788aff >水</font></marquee> <marquee scrollamount=6 direction="down" width=60 height=80><font size=5 color=#788aff>水</font></marquee> <marquee scrollamount=7 direction="down" width=60 height=80><font size=5 color=#788aff >水</font></marquee> <marquee scrollamount=8 direction="down" width=60 height=80><font size=5 color=#788aff>水</font></marquee> <marquee scrollamount=9 direction="down" width=60 height=80><font size=5 color=#788aff >水</font></marquee> <marquee scrollamount=10 direction="down" width=60 height=80><font size=5 color=#788aff >水</marquee></font>

範例：

<marquee scrollamount=3 direction="down" width=60 height=80><font size=5 color=#788aff>水</font></marquee><marquee scrollamount=4 direction="down" width=60 height=80><font size=5 color=#788aff >水</font></marquee> <marquee scrollamount=5 direction="down" width=60 height=80><font size=5 color=#788aff >水</font></marquee> <marquee scrollamount=6 direction="down" width=60 height=80><font size=5 color=#788aff>水</font></marquee> <marquee scrollamount=7 direction="down" width=60 height=80><font size=5 color=#788aff >水</font></marquee> <marquee scrollamount=8 direction="down" width=60 height=80><font size=5 color=#788aff>水</font></marquee> <marquee scrollamount=9 direction="down" width=60 height=80><font size=5 color=#788aff >水</font></marquee> <marquee scrollamount=10 direction="down" width=60 height=80><font size=5 color=#788aff >水</marquee></font>

結果：

 水 水 水 水 水 水 水 水

流星雨

語法：

<MARQUEE direction=down height=150><MARQUEE direction=left scrollAmount=15><FONT color=pink>　　／<BR><I>★</I></FONT></MARQUEE><MARQUEE direction=left scrollAmount=12><FONT color=deeppink>　　／<BR><I>★</I></FONT></MARQUEE><MARQUEE direction=left scrollAmount=9><FONT color=skyblue>　　／<BR><I>★</I></FONT></MARQUEE><br><MARQUEE direction=left scrollAmount=6><FONT color=ff99ff>　　／<BR><I>★</I></FONT></MARQUEE><br><MARQUEE direction=left scrollAmount=3><FONT color=33cc99>　　／<BR><I>★</I></FONT></MARQUEE><br></MARQUEE>

範例：

<MARQUEE direction=down height=150><MARQUEE direction=left scrollAmount=15><FONT color=pink>　　／<BR><I>★</I></FONT></MARQUEE><MARQUEE direction=left scrollAmount=12><FONT color=deeppink>　　／<BR><I>★</I></FONT></MARQUEE><MARQUEE direction=left scrollAmount=9><FONT color=skyblue>　　／<BR><I>★</I></FONT></MARQUEE><br><MARQUEE direction=left scrollAmount=6><FONT color=ff99ff>　　／<BR><I>★</I></FONT></MARQUEE><br><MARQUEE direction=left scrollAmount=3><FONT color=33cc99>　　／<BR><I>★</I></FONT></MARQUEE><br></MARQUEE>

結果：

　　／
★ 　　／
★ 　　／
★
　　／
★
　　／
★

　

說明：

每增加一行就可增加一個字的落下

流星雨二

語法：

<MARQUEE behavior=alternate scrollAmount=100 width=90%><FONT color=pink>★</FONT></MARQUEE><MARQUEE behavior=alternate scrollAmount=120 width=80%><FONT color=hotpink>★</FONT></MARQUEE><MARQUEE behavior=alternate scrollAmount=150 width=90%><FONT color=deeppink>★</FONT></MARQUEE><MARQUEE direction=down height=100><MARQUEE direction=left scrollAmount=10><FONT color=violet>　　／<BR><I> ★<br></I></FONT></MARQUEE><MARQUEE direction=left scrollAmount=10><FONT color=tomato>　　／<BR><I>★</I></FONT></MARQUEE><MARQUEE direction=left scrollAmount=8><FONT color=salmon>　　／<BR><I>★</I></FONT></MARQUEE></MARQUEE>

範例：

<MARQUEE behavior=alternate scrollAmount=100 width=90%><FONT color=pink>★</FONT></MARQUEE><MARQUEE behavior=alternate scrollAmount=120 width=80%><FONT color=hotpink>★</FONT></MARQUEE><MARQUEE behavior=alternate scrollAmount=150 width=90%><FONT color=deeppink>★</FONT></MARQUEE><MARQUEE direction=down height=100><MARQUEE direction=left scrollAmount=10><FONT color=violet>　　／<BR><I> ★<br></I></FONT></MARQUEE><MARQUEE direction=left scrollAmount=10><FONT color=tomato>　　／<BR><I>★</I></FONT></MARQUEE><MARQUEE direction=left scrollAmount=8><FONT color=salmon>　　／<BR><I>★</I></FONT></MARQUEE></MARQUEE>

結果：

 ★ ★ ★ 　　／
★
 　　／
★ 　　／
★

　

說明：

每增加一行就可增加一個字的落下

字加流星

語法：

<font color="#色碼" style=background:url(底圖網址)>輸入你要寫的字</font>

範例：

<font color="#EE0005" style=background:url(http://hk.geocities.com/zz14723/001/flake03.gif)>這樣子你會了嗎??</font>

結果：

 這樣子你會了嗎??

字加流星
(移動)

語法：

<marquee behavior=scroll><font style=background:url(底圖網址)> <font color=#色碼 size=字體大小>輸入你要寫的字</font>

範例：

<marquee behavior=scroll><font style=background:url(http://hk.geocities.com/zz14723/001/flake03.gif)><font color=#ffffca size=4>這樣子你會了嗎</font>

結果：

 這樣子你會了嗎

閃動的字

語法：

<font size=字的大小 style=background:url(底圖網址)>

上一篇

利用photoimpact12製造雨景 , 雪景 , 煙火效果動圖

下一篇

用閃圖做成【上下左右符號】

相關文章

我要留言