Blogger Hack - code程式碼, cmd命令提示字元, quote引用, format排版

因為有寫程式碼等需要，
而且 blogger 的引用 <blockquote>一直覺得沒有效果，
所以就 google 到了以下教學
Abin's Tech Note: 程式碼的標記區塊
良人的大秘寶: [筆記]在文章裡顯示優質的程式碼
通達人驛站: 在Blogger內使用引述
Format My Source Code for Blogging

在此感謝 Abin, 國良先生, 通達人, Greg Houston
修改後如下, 基本上是一樣的, 只是改成自己的字型, 顏色, gif 圖檔位置

去 Blogger後台 / 版面配置 / 修改 HTML / 修改範本
將 code 程式碼 CSS 語法貼在]]></b:skin>前面

code {

  display: block;

  font-family: 'Trebuchet';

  font-size: 10pt;

  overflow: auto;

  border: 1px solid #ccc;

  padding: 10px 10px 10px 20px;

  max-height: 1200px;

  line-height: 1.2em;

  letter-spacing: 0px;

  color: #000;

  background: #ccc url(http://lh6.ggpht.com/_JP9A9_sXGFk/SopmAmyZEII/AAAAAAAAASA/pAazs-tf8HE/BG_CODE.gif) left top repeat-y;

}

寫文章時將需要的內容貼在<code>big5許功蓋</code>裡面
發佈文章後看到的效果
big5許功蓋

將 cmd 命令提示字元 CSS 語法貼在]]></b:skin>前面

cmd {

  display: block;

  font-family: 'Trebuchet';

  font-size: 10pt;

  overflow: auto;

  border: 1px solid #ccc;

  padding: 10px 10px 10px 20px;

  max-height: 1200px;

  line-height: 1.2em;

  letter-spacing: 0px;

  color: #ccc;

  background: #000 url(http://lh6.ggpht.com/_JP9A9_sXGFk/SopmA0DcyCI/AAAAAAAAASE/cGAthJ7UkCc/BG_CMD.gif) left top repeat-y;;

}

寫文章時將需要的內容貼在<cmd>big5許功蓋</cmd>裡面
發佈文章後看到的效果
big5許功蓋

將 quote 引用 CSS 語法貼在]]></b:skin>前面

quote {

  display: block; /* fixes a strange ie margin bug */

  font-family: Trebuchet;

  font-size: 10pt;

  overflow: auto;

  border: 3px dotted #000;

  padding: 15px 15px 15px 30px; /*up right bottom left*/

  max-height:300px;

  line-height: 1.2em;

  background: #191919 ;

}