prettify 代码高亮插件使用

645次阅读
没有评论

prettify

介绍

  • code prettify 解释为 “代码修饰”。
  • 他由JS代码和CSS代码构成,用来高亮显示HTML页面中的代码。
  • 支持:C, Java, Python, Bash, HTML, XML, Javascript, Makefiles, Ruby, PHP, Awk, Perl, Basic, Clojure, CSS, Dart, Erlang, Go, Haskell, Lisp, Scheme, LLVM, Lua, Matlab, Pascal, R, Scala, SQL, LaTeX等语言

开始使用

在使用之前我建议将prettify.css中 li 的样式中添加:list-style-type:decimal 使得每行都有行号,而不是每5行有一个号。 加入主要的CSS文件和JS文件:

  <!-- 设置代码主题,此文件为默认主题,你可以换成其他主题-->
 <script src="js/prettify.js" type="text/javascript"></script> 

在标签中加入onload=”prettyPrint();”

将代码放在

标签内,其中 linenums 表示为代码添加行号,可以不写。
注意:像html中的特殊字符需要转义,比如<a>应该写成 &lt a &gt
例子
代码主题选择 

默认在prettify中有5种选择:

prettify.css
sunburst.css
desert.css
doxy.css
sons-of-obsidian.css
比如你想使用sunburst.css,则我们只需要将:</a>
 
<link rel="stylesheet" href="css/prettify.css"/>

替换成

<link rel="stylesheet" href="css/sunburst.css"/>

扩展样式可以从 http://jmblog.github.io/color-themes-for-google-code-prettify/ 、http://stanleyhlng.com/demo/?url=http%3A%2F%2Fdemo.stanleyhlng.com%2Fprettify-js%2F&surl=http%3A%2F%2Fstanleyhlng.com%2Fprettify-js%2F下载。

语言支持

prettify默认支持类C语言(如java等)等,我们可以通过添加额外的JS文件来使得prettify支持该语言的代码高亮(额外的JS文件从此处下载)。比如添加 lang_go.js 并

可以使得支持go语言。
admin
版权声明:本站原创文章,由admin2021-02-18发表,共计843字。
转载提示:除特殊说明外本站文章皆由CC-4.0协议发布,转载请注明出处。
评论(没有评论)