✿ 在文章中加入程式碼和框框

♪  engye 的笔记：

我又学到新的东西了，就是在文章中加入程式碼框框，像以下这样的框框。
学习是件很快乐的事

这样纪录程式碼时看起来也比较干净。
我怎样修改？ 我在网上搜索了不少文章，也战战兢兢试了不少次，发现这个可以用。
修改前，记得download 一份原本的HTML.万一改不好， 也不至于欲哭无泪。

------------------------------------------------------------------

1. 去到Edit HTML, 用Ctrl+F寻找以下的code (或到toolbar 的edit > find on this page ）
<b:skin>

找到后，在后面加入：
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;
line-height: 1.2em;
}

2。preview 一下，确定没有问题， 就save.

3。以后写文章时， 就在想要加框框的程式码之前加<code>,在程式码的之后加</code>

像这样（红色是加入部分，中间的程式码只是样本）
<code>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;
line-height: 1.2em;
}</code>

4. Save 之前， preview 一下，这时框框应该会出现了。

这样就完成了。

-------------------------------
我遇到什么问题？

写这一篇时，也摸索到一些新的东西。像是：
1。注意写文章时要换到Edit HTML 才可以看到这些语法，在compose 写，会出现一些不是我要的效果。
2。我是直接到 HTML Encoder 这里转换适合用的程式码，然后再贴到文章里。可以参考这里 和这里 。