blogger显示代码

25 May 2011 Update
new style from HERE
CODE {
white-space: pre;
font-family: Andale Mono, Lucida Console, Monaco, fixed, monospace;
color: #000000;
background-color: #eee;
font-size: 12px;
border: 1px dashed #999999;
line-height: 14px;
padding: 10px 10px 10px 21px; /* 內距綜合設定 依序為上右下左 */
margin: 5px 20px 5px 20px ; /* 邊界綜合設定 依序為上右下左 */
overflow:auto; /* 超出顯示範圍處理 全部顯示:visible 隱藏:hidden 捲軸:scroll 瀏覽器自動選擇:auto */
width: 90%;
}

另一个blogger显示代码的办法,更好看点,本文使用的正是这个css.


1. 给blogger设计添加高级css

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;
height:200px; // for IE6
line-height: 1.2em;
}

2.需要贴代码的地方写入(把《和》换成<和>
《code》代码《/code》