网页显示高亮代码简易方法

网页显示高亮代码有很多插件和方法，这里介绍一个简单的方法--SyntaxHighlighter。

1. 下载SyntaxHighlighter：http://alexgorbatchev.com/SyntaxHighlighter/download/

2. 在需要显示高亮代码到网页中添加如下代码（以高亮JavaScript代码为例）

<!-- css文件添加 --><link href="css/shCore.css" rel="stylesheet" type="text/css" /><link href="css/shThemeDefault.css" rel="stylesheet" type="text/css" /><!-- Js文件添加 --><script type="text/javascript" src="js/shCore.js"></script> <!-- 这里根据需要高亮的代码而选择相应Js文件，在下载的scripts文件中可找到 --><script type="text/javascript" src="css/shBrushJScript.js"></script>

3. 需要高亮显示的代码放在 "<pre class="brush: js"></pre>"标签中。

<pre class="brush: js">function foo(){}</pre>

"js“为需要高亮的代码类型，更多类型可参考：http://alexgorbatchev.com/SyntaxHighlighter/manual/brushes/

4. 显示高亮代码

<script type="text/javascript">     SyntaxHighlighter.all()</script>

现在代码高亮显示的配置就完成了。

参考:

http://alexgorbatchev.com/SyntaxHighlighter/manual/installation.html