2009年10月20日 星期二

在部落格中加入程式碼方塊

 

一開始不知道,我一直以為這是外掛可以解決Orz..
找了一些資料,才發現這個修改CSS就可以了,已下為修改紀錄。

版面設置→修改HTML→修改範本
加入下面這段。

 

CODE {
    display: block; /* fixes a strange ie margin bug */
    font-family: Courier New;
    font-size: 8pt;
    overflow:auto;
    background: #FF0000 url(http://sites.google.com/site/jting1981/chang-yong-dang-an/code.gif?attredirects=0) left top repeat-y;
    border: 1px solid #ccc;
    padding: 10px 10px 10px 21px;
    max-height:200px;
    height:200px; //for IE6
    line-height: 1.2em;
}

語法為下面這段

<code>test</code>

出現的效果

test

 

參考資料:

如何在BLOG網頁展示程式碼或顯示原始碼
在文章裡顯示優質的程式碼區
WP-CodeBox 程式碼高亮度外掛
Microsoft Live Writter(簡稱WLW)文章中加入程式碼

沒有留言:

張貼留言