各种类型的文字代码

Jin さんのプロフィール❤ ｡◕‿◕｡๑۩天平宫主の咖啡屋۩๑｡◕‿◕...フォトブログリストその他

ツール

ヘルプ

< 前へ次へ >

各种类型的文字代码

(原創 ╮(╯▽╰)/夢與天堂の空想世界~，http://spaces.msn.com/members/young59tw/)

EnglishVersion

網誌文字的編輯暫很重要的地位，但似乎編輯工具列好像少了什麼，以下對分別對文字作分析，提供HTML語法並對文字特效提供簡便Javascript工具。

要先知道:

1.要先會使用<HTML>模式輸入語法。(按這教學)

2.Javascript Button Tool的加入方式與使用。(按這連結)

3.如語法轉貼、修改或有更好建議，歡迎討論提供見解(留言板)。

一.基本文字類型:

1).字型的大小

直接用編輯工具欄"字型大小"得到以下制式的大小

超小....最大

如果想要超小超大，可以用語法讓字型小到看不到，大到非常大。

超小....................................................超大

HTML語法:字型大小

超大

說明:

FONT-SIZE: 800% 數字越大字型越大，數字越小字型越小。

Javascript Button Tool: FONT-SIZE『SATOSHI原創』

javascript:document.all("rtebox").getElementsByTagName("div")[2].focus();var a=document.selection.createRange();var c=window.prompt("Enter the FONT-SIZE","100%");if (c!=null){void(a.pasteHTML(""+a.htmlText+""));alert(" SUCCESS!!!!^_^\n\nMSNSpaces: young59tw");}

說明:

2.使用前必須清除字型大小之後，使用Tool才看的到效果。

3.反白所欲改變文字，使用Tool即見到效果。

2)刪除線

~~我被刪除了~~

HTML語法:刪除線

<STRIKE>我被刪除了</STRIKE>

Javascript Button Tool: StrikeThrough『SATOSHI原創』

javascript:document.all("rtebox").getElementsByTagName("div");void(document.selection.createRange().execCommand("StrikeThrough", false));

說明:

反白所欲改變文字，使用Tool即見到效果。如欲清除刪除線使用一次Tool即馬上恢復。

3)上標文字下標文字

我是標準 ^我是上標_我是下標

HTML語法:上標文字

我是上標

HTML語法:下標文字

我是下標

Javascript Button Tool: SUP(上標文字)『SATOSHI原創』

javascript:document.all("rtebox").getElementsByTagName("div");void(document.selection.createRange().execCommand("superscript", false));

Javascript Button Tool: SUB(下標文字)『SATOSHI原創』

javascript:document.all("rtebox").getElementsByTagName("div");void(document.selection.createRange().execCommand("subscript", false));

說明:

反白所欲改變文字，使用Tool即見到效果。如欲清除上下標文字再使用一次Tool即馬上恢復。

4)去除文字的樣式

在MSN Space中沒有文字樣式恢復的功能，如文字背景顏色...如要去除必須具備HTML的知識，現在來分析文字的HTML語法的架構

╮(╯▽╰)/夢與天堂の空想世界~

HTML語法:

╮(╯▽╰)/夢與天堂の空想世界~

以上文字包含了粗體、斜體、底線、字型大小、字型樣式，文字背景顏色，文字色彩，分析如下:

控制粗體文字效果。

控制斜體文字效果。

控制底線文字效果。

size=5 控制文字大小。

face="Arial Black" 控制字體的樣式。

color=#ff0000 控制文字顏色。

style="BACKGROUND-COLOR: #99ccff" 控制文字背景顏色。

以上如:字型大小、字型樣式，文字背景顏色，文字色彩，不需要可以直接刪除，恢復內定值。

另外提供Javascript Button Tool: ClearSelectStyle(恢復所選文字樣式)[爬山虎原创]

javascript:document.all("rtebox").getElementsByTagName("div")[2].focus();void(document.selection.createRange().execCommand("RemoveFormat"));

說明:

反白所欲恢復文字，使用Tool文字樣式及恢復内定值。

二.文字濾鏡效果:

1)發光(Glow Filter)文字

效果看這裡

HTML語法:發光文字

效果看這裡

說明:

color=#FF0000 控制發光的顏色，按這選取顏色16進位碼(#+色碼)或者按這選取顏色名稱。

strength=10 控制發光強度，強度越大數字越大可調1~255，但20以下效果比較明顯。

Javascript Button Tool: Golw Filter(發光文字)『SATOSHI原創』

javascript:document.all("rtebox").getElementsByTagName("div")[2].focus();var a=document.selection.createRange();var b=window.prompt("Color or #Hex value","#880000");if (b!=null){var c=window.prompt("Glow effect:1~255","2");if (c!=null){void(a.pasteHTML(""+a.htmlText+""));alert(" SUCCESS!!!!^_^\n\nMSNSpaces: young59tw");}}

說明:

反白所欲改變文字，使用Tool依序填入1.發光顏色,2.發光強度。

2)投射陰影(Shadow Filter)文字

投射陰影效果

HTML語法:投射陰影文字

投射陰影效果

說明:

color=#FF0000 控制投影顏色，按這選取顏色16進位碼(#+色碼)或者按這選取顏色名稱。

direction=135 控制控制投影方向，0,或45的倍數，不大於315。

方位圖:

315		0		45
	↖	↑	↗
270	←	█	→	90
	↙	↓	↘
225		180		135

Javascript Button Tool: Shadow Filter(投射陰影文字)『SATOSHI原創』

javascript:document.all("rtebox").getElementsByTagName("div")[2].focus();var a=document.selection.createRange();var b=window.prompt("Color or #Hex value","#880000");if (b!=null){var c=window.prompt("Directional offset of the shadow:0,or 45 times≦315","135");if (c!=null){void(a.pasteHTML(""+a.htmlText+""));alert(" SUCCESS!!!!^_^\n\nMSNSpaces: young59tw");}}

說明:

反白所欲改變文字，使用Tool依序填入1.投影顏色,2.投影方向。

3)陰影(Dropshadow Filter)文字

陰影效果

HTML語法:陰影文字

陰影效果

說明:

color=#FF0000 控制陰影顏色，按這選取顏色16進位碼(#+色碼)或者按這選取顏色名稱。

offX=5 控制陰影水平位移，正(+)為向右移，負(-)為向左移。

offY=5 控制陰影垂直位移，正(+)為向下移，負(-)為向上移。

Javascript Button Tool: Shadow Filter(陰影文字)『SATOSHI原創』

javascript:document.all("rtebox").getElementsByTagName("div")[2].focus();var a=document.selection.createRange();var b=window.prompt("Color or #Hex value","#880000");if (b!=null){var c=window.prompt("Shadow←→","5");if (c!=null){var f=window.prompt("Shadow↑↓","5");if (f!=null){void(a.pasteHTML(""+a.htmlText+""));alert(" SUCCESS!!!!^_^\n\nMSNSpaces: young59tw");}}}

說明:

反白所欲改變文字，使用Tool依序填入1.陰影顏色,2.陰影水平位移,3.陰影垂直位移。

4)模糊(Blur Filter)文字

看的清楚嗎??

HTML語法:模糊文字

模糊效果

說明:

direction=135 控制模糊方向，0,或45的倍數，不大於315。方位圖(按這)

strength=10 控制模糊影響強度，數字越大強度越大。

Javascript Button Tool: Blur Filter(模糊文字)『SATOSHI原創』

javascript:document.all("rtebox").getElementsByTagName("div")[2].focus();var a=document.selection.createRange();var c=window.prompt("Direction of the blur:0,or 45 times≦315","135");if (c!=null){var d=window.prompt("Blur effect:>0","5");if (d!=null){void(a.pasteHTML(""+a.htmlText+""));alert(" SUCCESS!!!!^_^\n\nMSNSpaces: young59tw");}}

說明:

反白所欲改變文字，使用Tool依序填入1.模糊方向,2.模糊影響強度。

5)半透明(Alpha Filter)文字

1.均勻(uniform) style=0

2.線性(linear) style=1

3.圓型(radial) style=2

AAAAAAAAAAAAAA

4.矩形(rectangular) style=3

AAAAAAAAAAAAAAA

HTML語法:半透明文字

AA

說明:

opacity=100 控制起始透明度，值0~100,100為不透明。

finishOpacity=0 控制結束透明度，值0~100,100為不透明。

style=1 控制濾鏡的樣式，值0~3，數字分別為 0.均勻(uniform) 1.線性(linear) 2.圓型(radial) 3.矩形(rectangular)。

Javascript Button Tool: Alpha Filter(半透明文字)『SATOSHI原創』

javascript:document.all("rtebox").getElementsByTagName("div")[2].focus();var a=document.selection.createRange();var b=window.prompt("Style=0:uniform 1:linear 2:radial 3:rectangular","0");if (b!=null){var c=window.prompt("opacity:0~100","0");if (c!=null){var f=window.prompt("finishOpacity:0~100","90");if (f!=null){void(a.pasteHTML(""+a.htmlText+""));alert("SUCCESS!\nMSNSpaces:young59tw");}}}

說明:

反白所欲改變文字，使用Tool依序填入1.濾鏡的樣式，2.起始透明度，3結束透明度。

6)波形(Wave Filter)文字

這是波形文字

HTML語法:波形文字

這是波形文字

說明:

freq=3 控制波的頻率，值越高波越密集，值越低波越稀疏。

strength=9 控制波振幅強度，值0~10。

lightstrength=9 控制波峰的強度，值0~100。

phase=0 波起始的相位，值0~100。

Javascript Button Tool: Wave Filter(波形文字)『SATOSHI原創』

javascript:document.all("rtebox").getElementsByTagName("div")[2].focus();var a=document.selection.createRange();var b=window.prompt("Freq.>0","5");if (b!=null){var c=window.prompt("strength>0","9");if (c!=null){var f=window.prompt("lightstrength≦100","9");if (f!=null){var g=window.prompt("phase<100","0");if (g!=null){void(a.pasteHTML(""+a.htmlText+""));alert("OK!\nyoung59tw");}}}}

說明:

反白所欲改變文字，使用Tool依序填入1.波的頻率，2.波振幅強度，3.波峰的強度，4.波起始的相位。

7)光罩(Mask Filter)文字

MASK

中間文字變透明了:)

加上1.彩虹背景2.不透明顏色設定跟底色一樣變成材質文字(背景添加方式請參考"利用<TABLE>製作"圖片並排顯示"的背景")

MASK

HTML語法:光罩文字

MASK

說明:

color=#FF0000 設定周圍不透明顏色，按這選取顏色16進位碼(#+色碼)或者按這選取顏色名稱

。

Javascript Button Tool: Mask Filter(光罩文字)『SATOSHI原創』

javascript:document.all("rtebox").getElementsByTagName("div")[2].focus();var a=document.selection.createRange();var c=window.prompt("Colour of the transparent regions:color or #Hex value","#880000");if (c!=null){void(a.pasteHTML(""+a.htmlText+""));alert(" SUCCESS!!!!^_^\n\nMSNSpaces: young59tw");}

說明:

反白所欲改變文字，使用Tool填入填入不透明顏色。

8)除色濾鏡(Chroma Filter)

Chroma

原始白字紅底定使用濾鏡除去白色得到

Chroma

HTML語法:除色濾鏡

Chroma

說明:

color=#FF0000 設定去除顏色，按這選取顏色16進位碼(#+色碼)或者按這選取顏色名稱

。

Javascript Button Tool: Mask Filter(除色濾鏡)『SATOSHI原創』

javascript:document.all("rtebox").getElementsByTagName("div")[2].focus();var a=document.selection.createRange();var c=window.prompt("Value of the color to be subject to chromakey transparency:color or #Hex value","#880000");if (c!=null){void(a.pasteHTML(""+a.htmlText+""));alert(" SUCCESS!!!!^_^\n\nMSNSpaces: young59tw");}

說明:

反白所欲改變文字，使用Tool填入填入去除顏色。

a)Javascript Button Tool的加入方式與使用

[註]:此方法在IE6.0瀏覽器測試可以使用。

Javascript 語言所寫出來的小工具，只要點選的動作就可以完成所希望的效果，減輕不少使用HTML語法上的不便，所以希望大家能夠學會。

只要把利用"我的最愛(收藏)"，把Javascript語言，當作URL捷徑的連結，就可以使用這工具。

方法如下圖:

加入完畢後，就可以點選方式使用工具唷

舉例說明:

1.已經完成我的最愛(收藏)已經加入"發光文字"的Javascript Button Tool。

2.當要使用時反白**要使用發光效果的文字。

3.點選我的最愛(收藏)的"發光文字"。依序填入彈跳視窗填入1.發光顏色，2.發光強度。完成的文字發光效果。

**反白的區域可以放大，效果更明顯。

b)濾鏡使用小技巧

1.點選濾鏡得到四周有個小方點(如下圖)，這時可以用滑鼠調整大小，調整大一點點濾鏡效果會更完美。

2.如要清除濾鏡，可以點選濾鏡得到四周有個小方點(如上圖)，按鍵盤←倒後鍵(不是方向鍵上)，即可清除濾鏡。

C)把Javascript Button Tool的濾鏡使用在圖片上

3.把圖片前後加上任意一字元如:@ (如下圖)，反白從@到#，使用濾鏡即可見到效果，然後利用DELETE刪除A和B。

^{從這裡開始反白↑} ^{↑這裡結束反白}

三.其他文字編輯工具:

1)材質文字效果產生器(按這進入)

╮(╯▽╰)/夢與天堂の空想世界~

這是小綠人辛苦的創作這簡便的工具，材質圖片製作做材質文字還有底線的功能，使用上非常便利。

2)彩色漸變文字產生器(按這下載)

╮(╯▽╰)/夢與天堂の空想世界~

這效果其實是利用工具計算每個文字所需的漸變顏色，製作漸變的效果。教學請見小綠人的彩色漸變文字產生器-專業版。

3.)線上橫行轉直行程式(按這進入)

(Chinese only)

登鸛雀樓　　　　王之渙

白日依山盡，黃河入海流﹔
欲窮千里目，更上一層樓。

橫行轉成直行

欲白　登
窮日　鸛
千依　雀
里山　樓
目盡　　
，，　　
更黃　　
上河　　
一入　王
層海　之
樓流　渙
。﹔

這是利用空格直接轉換的結果，需要的可以直接地用這線上工具。

4)標點符號輸入程式XP(按這下載)

這是PCMan所製作的，符號輸入的小工具，也是我最常使用，檔案只有13K唷。

5)常用字串輸入程式 v2.0.1(按這下載)

輸入大臉娃娃簡便的小工具，使用上非常方便，可以看這裡有趣的介紹"方便輸入大臉娃娃表情符-【常用字串輸入程式 v2.0.1】"

6.)假古文中文排版工具(按這進入)

(Chinese only)

　|欲|白|登|
　|窮|日|鸛|
　|千|依|雀|
　|裡|山|樓|
　|目|盡|　|
　|，|，|　|
　|更|黃|　|
　|上|河|　|
　|一|入|王|
　|層|海|之|
　|樓|流|渙|
　|。|﹔|　|

這也是橫行轉成直行的工具，多了格線，看起來古味十足。

6月3日 11:09 | この記事を引用

コメントを投稿するには、お使いの Windows Live ID でサインインしてください (Hotmail、Messenger、または Xbox LIVE を既に使用している場合は、そのアカウントが Windows Live ID です)。サインイン

Windows Live ID をお持ちでない場合は、アカウントを新規登録してください。

トラックバック

この記事のトラックバックの URL は次のとおりです。

http://sky1001hy.spaces.live.com/blog/cns!5AE7A2745DFDBF75!468.trak

この記事を参照しているブログ

なし