PrismJs

Table of Contents

Prism 是一款代码语法高亮的插件。（本博客也是用这高亮语法）

例子
#

1、加载原文件，主题 CSS 和 Prism 的文件

<!DOCTYPE html>
<html>
  <head>
    ...
    <link href="themes/prism.css" rel="stylesheet" />
  </head>
  <body>
    ...
    <script src="prism.js"></script>
  </body>
</html>

2、使用语法，在 <code> 添加 class：language-xxx

xxx 就是要高亮的代码语言,例如 CSS

Code:

<pre><code class="language-css">
  p { 
    color: red;
  }
</code></pre>

渲染：

p {
  color: red;
}

默认语法包括：html, css, javascript。其它的语法（如 nginx、typescript、bash、diff）需要额外的资料。在下载页（ http://prismjs.com/download.html ）把需要的代码语言打勾。

Prism 也有好多插件，高亮某一行代码，显示行号，预览颜色、CSS 的动画时间、角度，自动添加链接……等等。

Prism 提供了七款主题，有需要的可以根据要求写自己的。

下载页也会显示总共文件大小。

例子#

例子
#