首页 > 特效插件 > 代码高亮 >  代码高亮插件prettyPrint.js正文

代码高亮插件prettyPrint.js

特效介绍
prettyprint.js

    在很多技术型的网站中,经常会用到代码高亮插件,让代码区域看起来和编辑器一样好看。而且,代码可读性也大大提高了。我爱模板网就采用了代码高亮插件syntaxhighlighter.js。今天,推荐的不是这个高亮插件,而是:prettyPrint.js代码高亮插件,它的默认效果是深灰色背景+圆角,文字高亮,支持JavaScript、Java、C等十几种语言的高亮效果。
使用方法
第一步,引入prettify.js和prettify.css
<script src="js/prettify.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="css/prettify.css"/>
第二步,在body的onload事件里添加函数”prettyPrint()”
<body onload="prettyPrint()">
第三步,pre标签添加CSS类“prettyprint linenums”
<pre class="prettyprint linenums">
或者你也可以这样,使用js动态添加
$(document).ready(function() {
    $(".entry-content pre").addClass("prettyprint linenums");
});