网页中的代码高亮显示

我们平时会在文章里添加一些代码,这些代码放在网页上显得异常难看。我平时看到这种代码会感到很头痛,失去了看下去的耐心。为了让其他人更舒适地阅读自己的代码,应该在网页上加入代码高亮插件。SyntaxHighlighter 是一款不错的代码高亮插件,使用起来也非常简单。

首先要载入SyntaxHighlighter 的CSS文件和JS文件:

<script type="text/javascript" src="SyntaxHighlighter/shCore.js"></script>
<link rel="stylesheet" type="text/css" href"shCoreDefault.css">

你把文件放在哪里,路径当然也相应要做变化。

然后执行JS方法:

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

最后的一步是将需要高亮的代码放入指定的标签内:

<pre class="brush:代码类型;toolbar:false;"></pre>

代码类型这里写你的代码语言名称,如:

<pre class="brush:php;toolbar:false;">这里是php代码了</pre>

发表评论

电子邮件地址不会被公开。 必填项已用*标注