blogger自己並不具備程式碼高亮功能，發布的程式碼片段閱讀起來比較費勁
不過話說回來，哪一家部落格有支援這項目的???
所幸blogger自由度高而且願意製作分享工具的人多
所以方法還不只一種呢，以下介紹豬腦爸本人最愛二款
1.使用google-code-prettify提供的高亮腳本 ●進入blogger模板設置，在<head>標籤裡引用相關的js和css進入blogger模板設置
<link href='http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.css' rel='stylesheet' type='text/css'/>
<script src='http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.js' type='text/javascript'/>
●在body標籤中添加onload事件，調用腳本對代碼進行格式化：
<body onload='prettyPrint()'>
●發布文章時，需要格式化的文檔，只需要使用"code"或"pre"的標籤包含起來即可：
<pre class="prettyprint">...</pre>
<code class="prettyprint">...</code>
●另外針對程式碼的不同，也可以特別標示出來，只要在code、pre標籤後加 "lang-* "(*表示不同語法的程式碼，如vb、xml、java…若是寫出來顏色不對或沒有顏色，表示你*的地方寫得不是他的代號，通常這代號都照著程式碼語法)
"<pre class="prettyprint lang-vb>"
以下是在blog上的效果
2.SyntaxHiglighter
●下載此一壓縮包(下載連結)。下載後，請將裡面的所有檔案，都上傳至您的網頁空間。
●接著，在BLOGGER裡編輯HTML，在</head>標籤前， </body>標籤後加入下列程式碼，其中www.dnowba.somee.com要改成您自已的位置，小弟也是用免費的空間在用的。
<!--SYNTAX HIGHLIGHTER BEGINS-->
<link href='http://www.dnowba.somee.com/syntax/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://www.dnowba.somee.com/syntax/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>
<script src='http://www.dnowba.somee.com/syntax/scripts/shCore.js' type='text/javascript'></script>
<script src='http://www.dnowba.somee.com/syntax/scripts/shBrushCpp.js' type='text/javascript'></script>
<script src='http://www.dnowba.somee.com/syntax/scripts/shBrushCSharp.js' type='text/javascript'></script>
<script src='http://www.dnowba.somee.com/syntax/scripts/shBrushCss.js' type='text/javascript'></script>
<script src='http://www.dnowba.somee.com/syntax/scripts/shBrushJava.js' type='text/javascript'></script>
<script src='http://www.dnowba.somee.com/syntax/scripts/shBrushJScript.js' type='text/javascript'></script>
<script src='http://www.dnowba.somee.com/syntax/scripts/shBrushPhp.js' type='text/javascript'></script>
<script src='http://www.dnowba.somee.com/syntax/scripts/shBrushPython.js' type='text/javascript'></script>
<script src='http://www.dnowba.somee.com/syntax/scripts/shBrushRuby.js' type='text/javascript'></script>
<script src='http://www.dnowba.somee.com/syntax/scripts/shBrushSql.js' type='text/javascript'></script>
<script src='http://www.dnowba.somee.com/syntax/scripts/shBrushVb.js' type='text/javascript'></script>
<script src='http://www.dnowba.somee.com/syntax/scripts/shBrushXml.js' type='text/javascript'></script>
<script src='http://www.dnowba.somee.com/syntax/scripts/shBrushPerl.js' type='text/javascript'></script>
<script language='javascript'>
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.defaults[‘auto-links’]=false;
SyntaxHighlighter.all();
</script>
<!--SYNTAX HIGHLIGHTER ENDS-->
<pre class="brush: html;">
<p>this is a test</p>
</pre>
以下為範例
Ⓞ總結來說：
第一種和第二種的方式其實無異，感覺上第二種要上傳東西到自已的網站，其實注意一下第一種在下link href標籤也是去撈資料，差別在於第一種人家已經幫你把需要用的檔案放在網站上了，所以其實第二種也有不用自已掛網站的方式，SyntaxHiglighter網站看一下就知道了，而比較起來第二種用的檔案比較多…因為他的功能比較多就是了。所以第二種豬腦爸強力推薦。
syntaxHighlighter優點：
可顯示程式碼行數，透過「檢視」功能又可以去掉行數方便使用的人複製
每行用顏色來分隔，更容易檢視
可以自已選擇甚至設計css模板
未來有時間再放些學習心得吧
html网页设计代码示例
回覆刪除html示例 - Div标签相对负顶值