Pages

2008/06/07

[Blogger] 在blogger文章標示程式碼區域

如何在 blogger 文章中標示程式碼區域,
在網路上找了一些教學 ( Ex:Warrick-DoDo ),
再加上自己些微地修改,
我的 blogger 文章也可以顯示程式碼區域。

[教學]
在 blogger 的 Template 中,加入 CSS 樣式如下:
code {
    display: block;
    font-family: Courier New;
    font-size: 9pt;
    overflow:auto;
    background: #f0f0f0 url(http://ping.googlepages.com/Code_BG_1.png) left top repeat-y;
    border: 1px solid #ccc;
    padding: 10px 15px 15px 20px;
    max-height:200px;
    line-height: 1.2em;
    margin: 5px 5px 5px 15px;
}
在寫文章時,若該段文章須以程式碼區域顯示,
只須將該段文章放在<code></code>之間便可以以桯式碼區域顯示。

No comments: