而且 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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfTu82R8CdicYZGY4dfh3eg_jV6w_s6WZmxeSp9R2HBYNNYdB3F70zrHuV2PfCgEllTNJ9Edj8y7obFqaa6wPyUZ2lHIcSYsSztR__vOiOvDJ_qstrZ7zqG3A7W6Gn-Pnco7qRvNecCu_1/) 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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg68fH0Q-kwPa1eq5RWbBp6HVg3QKh8XcxMthvUMFo0NyisAowg4HTRfIMg2wf6yMPwBzZsOVNdJzUeng6t9HrXEvYgw5h5Kqemy4X83YFMgMEo65fyJp8X49RiNVRkNyRqAfogfdj8ysWv/) left top repeat-y;;
}
寫文章時將需要的內容貼在<cmd>big5許功蓋</cmd>裡面
發佈文章後看到的效果
將 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 ;
}
寫文章時將需要的內容貼在<quote>big5許功蓋</qoute>裡面
發佈文章後看到的效果
big5許功蓋
另外, 因為 html 語法的關係
在寫 html code 時會把文章中的 tag 標籤用掉
所以, 文章中的
- < 要用 < 取代
- > 要用 > 取代
- & 要用 & 取代
就去 Format 排版 一次解決
沒有留言:
張貼留言