在Blogger上顯示Code碼區塊

為了讓自己的Blogger可以顯示程式碼以方便閱讀及複製，可以在範本中增加CSS的樣式

操左步驟如下

「範本」→「自訂」→「進階」→「新增CSS」→貼上CODE碼→套用至網誌

以下就是要貼上的內容

CODE { display: block; /* fixes a strange ie margin bug */ font-family: Courier New; font-size: 8pt; overflow:auto; background: #f0f0f0 url(http://klcintw.images.googlepages.com/Code_BG.gif) left top repeat-y; border: 1px solid #ccc; padding: 10px 10px 10px 21px; max-height:200px; line-height: 1.2em; }

再來剩下最後一哩路，那就是怎麼使用了，其實也很簡單，凡是遇到要輸入程式碼的時候

，請切換到HTML模式下，在頭尾的地方分別加上<CODE>及</CODE>，把程式碼包起來即可。

顯示結果如下

參考網頁：

• 在 Blog 中顯示明顯的程式碼區塊 Code Block - 1
• 如何在 Blogger 上建立 code block 程式碼顯示區塊