Google Code Prettify

Google Code Prettify是Google Code今日推出的新專案，內含的Javascript和CSS檔案，可以將網頁中出現的程式原始碼以不同顏色區隔並美化，使用方式非常簡單，只需三個步驟：

1. 使用者必須先將prettify.css和prettify.js這兩個檔案上傳到自己的機器，並且在網頁開頭預先引入。

<link href="prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="prettify.js"></script>

2. 在網頁的body標籤內，加上onload="prettyPrint()"，使上述的js在網頁載入後便起作用。
3. 最後，只要將程式碼放入<pre class="prettyprint">...</pre>或<code class="prettyprint">...</code>之間，即可得到如上圖一般，以顏色重新標示過的程式碼。

使用者可以透過編輯prettify.css這個檔案，來修改程式碼的顏色。

目前這支JS可以自動判斷C、Java、Python、Bash、SQL、HTML、XML、CSS、Javascript、Makefiles、Ruby、PHP和Awk等程式語言，也能支援目前的主要瀏覽器（IE 6、Firefox 1.5 & 2和Safari 2.0.4）。

推薦給經常在blog中進行程式碼解說的同好使用:)

可能的相關文章：

• WordPress Plugin: SyntaxHighlighter Plus
• 在網頁中動態顯示年份
• WordPress Plugin: SyntaxHighlighter
• 使表格橫列兩色交錯的Javascript

這篇文章發表於 March 22nd, 2007 ，分類為：Webdev。你可以訂閱這篇文章的回應：RSS 2.0，也歡迎發表你的意見，或者從你的網站 Trackback 過來。