Endless TACOJOHN

很讚的一個CSS，非常適合我們這種死工程師
即愛分享code，又要把reference給寫出來時，這種block就真的很簡潔明瞭

樣式跟程式如下所示
/* CSS for Code Block in content */
code.code {
display: block; /* fixes a strange ie margin bug */
font: $bodyFont;
font-size: 10pt;
overflow:auto; /* 是否顯示scroll bar*/
background: #f0f0f0 url(http://klcintw.images.googlepages.com/Code_BG.gif) left top repeat-y;
border: 1px dashed #ccc;
padding: 10px 5px 10px 20px;
margin: 5px 0 0 15px;
max-height:250px;
line-height: 1.2em;
}

code.ref{
display: block; /* fixes a strange ie margin bug */
overflow:auto; /* 是否顯示scroll bar*/
background: #fff url(http://chenkaie.googlepages.com/Code_REF.gif) left top repeat-y;
border: 1px dashed #333;
padding: 10px 5px 10px 20px;
margin: 5px 0 0 15px;
font-size: 13px;
font: $bodyFont;
line-height: 1.6em;
}
第一個控制的是code的部份，第二個則是控制reference的部份囉!!
就加在內的CSS語法中即可!!

PO文時，使用方法如下：
<code class="code"> 程式的部份 </code>
<code class="ref"> REFERENCE的部份 </code>
※參考來源：
．良人的大秘寶-[筆記]在文章裡顯示優質的程式碼區
．Kaie's Blog-[CSS] A Cool blockquote for "Code style" and some blogging tips