2008年12月18日星期四

Blogger代码高亮

参考这篇文章:
google prettify code给blogspot代码着色

1.进入Blogspot控制台 -->布局 -->修改HTML
在head标签内调用google prettify code的Javascript和CSS文件:

<link href="http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.css" rel="stylesheet" type="text/css"/>
<script src="http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.js" type="text/javascript"/>

2.将“<body>”改成“<body onload="prettyPrint()">”
3.修改pre标签的CSS以适合您的使用。

pre {
margin: 5px 20px;
border: 1px dashed #666;
padding: 5px;
background: #f8f8f8;
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}

设置好后, 编辑帖子时:

<pre class="prettyprint">

add your code here

</pre>

没有评论: