一款代码高亮插件 -- SyntaxHighlighter

SyntaxHighlighter 是当前用得最多的一款代码高亮插件,包括本博客也用到了该插件来显示代码,大家可以看到效果了。只不过这是针对WordPress的一款代码高亮插件,而今天我要给大家介绍的是针对所有类型网站都可以用的juqery插件不容错过额。

使用步骤

1、默认代码格式

<pre class="brush:js;toolbar:false">
var&nbsp;myMood&nbsp;="happy"; //单词“happy”是JavaScript语言中的一个字面量(literal),也就是可以直接在JavaScript代码中写出来的数据。 //单词“var”是一个关键字 //myMood是一个变量名字
</
pre>

 

2、引入以下的js和css文件,要使用哪种刷子就引用哪种语言的刷子文件,下面有详细的讲解。官方下载地址

<!--syntaxhighlighter_3.0.83 代码高亮插件-->
<script type="text/javascript" src="__PUBLIC__/Home/syntaxhighlighter_3.0.83/scripts/shCore.js"></script>
<script type="text/javascript" src="__PUBLIC__/Home/syntaxhighlighter_3.0.83/scripts/shBrushJScript.js"></script>
<link type="text/css" rel="stylesheet" href="__PUBLIC__/Home/syntaxhighlighter_3.0.83/styles/shCoreDefault.css"/>
<script type="text/javascript">SyntaxHighlighter.all();</script>

 3、代码美化后展现

var&nbsp;myMood&nbsp;="happy";
//单词“happy”是JavaScript语言中的一个字面量(literal),也就是可以直接在JavaScript代码中写出来的数据。
//单词“var”是一个关键字
//myMood是一个变量名

 

4、html/css/js/php 使用同一种高亮方式,修改一下shBrushJScript.js就行了,哈哈  我只会这样搞

posted @ 2016-04-05 16:34  晃晃567  阅读(368)  评论(2编辑  收藏  举报