經常在一些 Blogger 看到教學內容「程式碼」的區段, 都是包在一個特別區塊中,可以清 楚的分辦本文及程式碼;但這要怎 麼做呢?其實真的很簡單,只要在 <head> </head> 之間的 CSS 區塊,如 <b:skin><![CDAT A[ 的後面,加入下列程式碼即可。
其中紅字部分,可以修改為自己所 想用使用的圖檔網址哦!
code {
display: block; /* fixes a strange ie margin bug */
font-family: Courier New;
font-size: 9pt;
overflow:auto;
background: #fff5ee url(圖片網址) left top repeat-y;
border: 1px solid #ccc;
padding: 5px 5px 5px 20px;
max-height:200p x;
line-height: 1.2em;
margin: 5px 0 0 15px;
}
以上步驟完成後,只要在文章中, 想把有「程式碼」的那一段區域, 在「編輯html」用 <code> </code> 將程式碼包起來就可以囉。
本文參閱自:在教學文章中,與眾不同的程式碼
其中紅字部分,可以修改為自己所
code {
display: block; /* fixes a strange ie margin bug */
font-family: Courier New;
font-size: 9pt;
overflow:auto;
background: #fff5ee url(圖片網址) left top repeat-y;
border: 1px solid #ccc;
padding: 5px 5px 5px 20px;
max-height:200p
line-height: 1.2em;
margin: 5px 0 0 15px;
}
以上步驟完成後,只要在文章中,
本文參閱自:在教學文章中,與眾不同的程式碼
全站熱搜
留言列表