Highlight.js是一个可以给pre标签中的代码高亮的插件，highlight不依赖于第三方js库，支持上百种语言高亮和几十种样式风格，它可以自动检测语言，完美兼容各种框架。
准备
进入highlight官网下载https://highlightjs.org/download/，下载前可以选择你需要的语言，尽量使下载的文件最小。
如何使用
将下载好的压缩包解压缩后，你会发现有几十种风格css可以选择，默认是default.css，如果要换风格，直接将default.css换掉即可。将js和css文件加入到html中。
<link rel="stylesheet" href="https://zhishitu.com">
<script src="/path/to/highlight.pack.js"></script>
<script>hljs.initHighlightingOnLoad();</script>可以看出与Prism.js不同，highlight在加载完js和css文件后，还要调用hljs.initHighlightingOnLoad();才能看到效果。
在页面文档中添加<pre><code>标签元素，Highlight会自动检测语言并渲染高亮显示，当然你可以在class属性中直接知道语言，如：
<pre><code class="html">...</code></pre>支持的class语言可以在下载页面中的列表中找到，也可以使用language-或lang-作为前缀。如果要禁用高亮显示，可以使用nohighlight类。
<pre><code class="nohighlight">...</code></pre>highlight.js 支持几十种种编程语言（完整语言列表看这里），既包括常见的 C、java、javascript、ruby、python、html、css等，还支持 apache、nginx 这些配置文件的语法，所以，在你书写这些代码的时候，可以看看 highlight.js 是否支持所用的语法，然后标注对应的语言，让 highlight.js 完美的对其高亮显示吧。
Highlight也可以使用NPM来安装：
npm install highlight.js