在Blog貼程式碼或展示程式碼

  
想在Blog上放工整的程式原始碼嗎?

其實只要在樣板設定裡加段CSS就行了!!!


下面的CSS中有使用到一張背景圖是存在Meson的flickr 相本
你可以將圖另存新檔之後存到自己的相本
然後再修改Step1 中藍色字樣部份的URL 網址
將它指向你所存的圖片網址
若是你不介意的話也可以延用我Flickr 上的這張圖
只是哪天我不小心砍掉這張圖
就會影響到你的原始碼展示的美觀了..



Step 1. 在你的BLOG CSS 新增下列程式碼
 CODE { display: block; /* fixes a strange ie margin bug */ font-family: Courier New; font-size: 8pt; overflow:auto; background: #FFFFBF url(http://pics21.yamedia.tw/33/userfile/d/diiuuli520/blog/14e38f78993202.gif) left top repeat-y; border: 1px solid #ccc; padding: 10px 10px 10px 21px; max-height:200px; line-height: 1.2em; }

Step 2. 將你的想要顯示的原始碼內容使用code 標籤包起來
<code> 12345我想要秀出來的內容abcdefg</code>








Step 3. 展示效果
 12345我想要秀出來的內容diiuuli520