网页代码高亮显
示插件 google prettify 的使用方法
1.下载插件google prettify
地址:https://github.com/google/code-prettify zip下载
2.引入google prettify js和css文件
这个是谷歌的代码美化插件,在使用的时候需要引入两个文件,分别是prettify.js 核心js、prettify.css 主题样式,
3.调用google prettify运行
然后在body调用onload="PR.prettyPrint()"函数。该函数可以让js给代码中的一些标记上色。还需要在pre标签中加入prettyprint和linenums两个类样式。
示例代码:
html<!DOCTYPE html><html><head><meta charset="utf-8"><title>Run_Prettify Test</title><script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.8.3/jquery.min.js"></script><script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script><link rel="stylesheet" href="https://github.com/google/code-prettify/blob/master/loader/prettify.css"/></head><body onload="PR.prettyPrint()"><pre class="prettyprint linenums">testtest</pre></body></html>
官网教程:https://github.com/google/code-prettify/blob/master/docs/getting_started.md
官网demo:https://github.com/google/code-prettify/blob/master/examples/quine.html