《常用語法》C14

語 法 測 試 區

語法輸入區:
按"執行"觀看結果

改變字的大小顏色 語法: <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>

結果:

常用語法

文字超連結 語法: <a href="你要超連結網址" target="連結開啟方式">你要出現的字</a>
範例: <a href="http://home.educities.edu.tw/nkhs9323005/" target="_blank">歡迎光臨漪唲、籽潼、咿咡緦的家</a>
結果: 歡迎光臨漪唲、籽潼、咿咡緦的家

貼圖方式 語法: <img src="圖片網址" width="圖片顯示寬度尺寸" height="圖片顯示高度尺寸">
範例: <img src="http://home.educities.edu.tw/nkhs9323005/gif0398.gif" width="300" height="100">
結果:
說明: "圖片網址"→將滑鼠移至要貼的圖上→右鍵→內容即可看到"圖片網址"

矇朧圖片 語法: <img src="圖片網址" style="filter:Alpha(opacity=100,style=三種變化(1至3))">
範例: <img src="http://home.educities.edu.tw/nkhs9323005/jpg0137.jpg" style="filter:Alpha(opacity=100,style=2)">
結果:

圖片文字 語法: <table height="圖片高度" width="圖片寬度" align="center" background="圖片網址" border="6"><td style="FILTER: glow(strength=1)mask(color=#B4BBCF)chroma(color=#B4BBCF)" align="middle" height="54"><p align="center"><font face="MingLiU" color="#8c96b5" size="6"><b><i>輸入你要出現的字</i></b></font></p></td></table>
範例: <table height="170" width="420" align="center" background="http://home.educities.edu.tw/nkhs9323005/gif0384.gif" border="6"><td style="FILTER: glow(strength=1)mask(color=#B4BBCF)chroma(color=#B4BBCF)" align="middle" height="54"><p align="center"><font face="MingLiU" color="#8c96b5" size="6"><b><i>★常用語法★</i></b></font></p></td></table>
結果:

★常用語法★

圖片超連結 語法: <a href="你要連結的網址" target="視窗開啟方式"><img border="0" src="圖片網址" alt="網頁說明" width="圖片的寬度" height="圖片的高度"></a>
範例: <a href="http://home.educities.edu.tw/nkhs9323005/" target="_blank"><img border="0" src="http://home.educities.edu.tw/nkhs9323005/logo8nkhs9323005.gif" alt="咿咡緦的家" width="88" height="31"></a>
結果: 歡迎光臨漪唲、籽潼、咿咡緦的家

水中倒影 語法: <img id="reflect" src="圖片網址"><br>
<script language="JavaScript1.2">
function f1(){setInterval("mdiv.filters.wave.phase+=10",100);} if (document.all){document.write('<img id=mdiv src="'+document.all.reflect.src+'" style="filter:wave(strength=3,freq=3,phase=0,lightstrength=30) blur() flipv()">')
window.onload=f1}
</script>
範例: <img id="reflect" src="http://home.educities.edu.tw/nkhs9323005/gif0275.gif"><br>
<script language="JavaScript1.2">
function f1(){setInterval("mdiv.filters.wave.phase+=10",100);} if (document.all){document.write('<img id=mdiv src="'+document.all.reflect.src+'" style="filter:wave(strength=3,freq=3,phase=0,lightstrength=30) blur() flipv()">')
window.onload=f1}
</script>
結果:
說明: "圖片網址"→將滑鼠移至要貼的圖上右鍵內容即可看到"圖片網址"

背景音樂 語法: <bgsound src="音樂檔網址" loop="infinite">
範例: <bgsound src="http://home.educities.edu.tw/nkhs9323005/mid001.mid" loop="infinite">
結果:

音樂: <<------

說明: 當你貼到網頁時音樂是自動播放的不用再按

Media
MTV
Flash
播放方式
語法: <embed src="音樂檔網址" width=播放器寬度 height=播放器高度>
範例: <embed src="http://jrs.myweb.hinet.net/20051220.swf" width=410 height=345>
結果: Flash:寂靜
說明: 當你貼到網頁時音樂是自動播放的不用再按

背景圖 語法: <body background="背景網址" bgproperties="fixed">
範例: <body background="http://home.educities.edu.tw/nkhs9323005/back0053.jpg" bgproperties="fixed">
結果: 背景圖
說明: "背景圖片網址"→將滑鼠移至要貼的圖上→右鍵→內容即可看到"背景網址"

跑馬燈由右向左 語法: <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://home.educities.edu.tw/nkhs9323005/gif0434.gif)>這樣子你會了嗎??</font>
結果: 這樣子你會了嗎??

字加流星移動 語法: <marquee behavior=scroll><font style=background:url(底圖網址)> <font color=#色碼 size=字體大小>輸入你要寫的字</font>
範例: <marquee behavior=scroll><font style=background:url(http://home.educities.edu.tw/nkhs9323005/gif0434.gif)><font color=#ffffca size=4>這樣子你會了嗎</font>
結果: 這樣子你會了嗎

閃動的字 語法: <font size=字的大小 style=background:url(底圖網址)>輸入你要寫的字</font>
範例: <font size=4 style=background:url(http://home.educities.edu.tw/nkhs9323005/gif0435.gif)>看到效果了嗎</font>
結果: 看到效果了嗎

閃動的字移動 語法: <font size=字的大小 style=background:url(底圖網址)><marquee>輸入你要寫的字</marquee></font>
範例: <font size=4 style=background:url(http://home.educities.edu.tw/nkhs9323005/gif0435.gif)><marquee>輸入你要寫的字</marquee></font>
結果: 輸入你要寫的字

網頁特效語法參考

漪唲亞卓網 漪奇摩部落 勾選按鍵區 游標冒泡區 燈籠式連結
背景選擇單 照片區範例 常用語法區 顏色數碼表 施放煙火區
特殊符號區 心形字程式 捲軸變色器 換頁效果區 網頁加密區
視窗分割器 選單產生器 自做連結區 梅林大師區 飄浮目錄區
隱藏式燈籠 隱藏式連結 隨機音樂單 隨機音樂器 倒數計時器
gif插圖區 GIF插圖區 jpg插圖區 JPG插圖區 分隔線圖區
背景圖片區 跑馬燈列車 網站蓷薦區 實用網站區 網頁語法區
雪花片片區 流星語法區 煙火語法區 下雨語法區 魚兒水中游
閃爍背景區 蝴蝶飛舞一 蝴蝶飛舞二 滑鼠冒泡區 圖片飄落區
圖片上飄區 花雨語法區 浮現背景圖 圖片飄浮一 圖片飄浮二
可移動圖片 彩框視窗區 向我飛奔區 衝天星火區 繽紛銀河區
自動捲軸區 背景顏色單 圖片變亮區 圖片漸亮區 變換圖片一
變換圖片二 圖片組合區 浮動圖片區 皮帶式相簿 盛開的花朵
背景圖下移 背景圖斜移 網頁光環區 飄浮圖片區 天使飛舞區
背景選擇單 流星橫移區 伸展視窗區 隱藏式燈籠 歡迎視窗區
飄浮目錄單 精美日曆區 月中漫舞區 換頁效果區 圖片橫移區
時鐘顯示器 顫抖圖片區 梅林大師區 倒數計時器 圖片圍繞區
轉動的文字 變字效果區 光暈文字區 擺動文字區 轉色文字區
連結變色區 圖片加框區 設定為首頁 加入最愛中 關閉此視窗
一般貼圖器 swf貼圖器 框架產生器 奇摩部落格 背景圖語法
背景音樂器 被動式音樂 主動式音樂 觸控下拉式 自動轉址區

滑鼠特效語法參考

字跟游標一 字跟游標二 字繞游標一 字繞游標二 圖片跟游標
幻燈片游標 瞄準十字線 圖片繞圈圈 蝴蝶游標區 星點游標一
星點游標二 三色游標一 三色游標二 冒泡游標區 心花朵朵開
如影隨形區 軌跡式游標 龍飛鳳舞式 游標式時鐘 財源滾滾區
滑鼠光環一 滑鼠光環二 聖誕雪橇區 燈籠滑鼠區 滑鼠滿天星
旋轉圖片區 圖繞滑鼠區 觸控說明區 時鐘預覽表 滑鼠預覽表