- Google Code Prettify
之前就有考慮要syntax highlighter來輔助程式碼的顯示，但是總感覺loading太重，所以還是選擇用抓圖的形式來顯示程式碼。最近看到了Google Code Prettify感覺還算可以，有興趣的人可以用用看。
官方頁面如下:
http://code.google.com/p/google-code-prettify/
安裝方式請參考下面的網頁：
http://google-code-prettify.googlecode.com/svn/trunk/README.html
當一切設定好之後，你會發現code的顏色的確有改變，但是總覺得有點不完善，這時你可以修改你的html範本，增加CSS Code如下：
code {
display: block;
font-family: 'Verdana';
font-size: 8pt;
font-weight: bold;
overflow: auto;
white-space: nowrap;
border: 1px solid #7F7F7F;
padding: 10px 10px 10px 21px;
max-height: 600px;
line-height: 1.5em;
letter-spacing: 0px;
color: #000000;
background: #fbfaf7 url(http://sites.google.com/site/xinyu0123/Home/BG_CODE.gif) left top repeat-y;
}
最後那個background設定目的是要在程式碼左邊顯示一條code的標籤，你可以不用加上它。儲存完範本之後，每當你使用code標籤貼上程式碼就會有如上的效果。
PS. 每當我切換blog的撰寫模式之後，整個code的排版又被歸零，看來只能再尋找更好的方法，或者是哪天想不開自己用Flash寫好了。
Web Color Code的部份可以參考下面的網頁：
http://www.computerhope.com/htmcolor.htm
關於CSS語法部分可以參考下面的網站:
No comments:
Post a Comment