Prism.js是一个轻量级的语法高亮库,

支持多种编程语言和代码主题,在前端开发中较为常用。下面是使用示例:

  1. 引入prism.js和相应的主题css文件和对应的语言插件:
<link href="path/to/prism.css" rel="stylesheet" />
<script src="path/to/prism.js"></script>
<script src="path/to/prism-language1.js"></script>
<script src="path/to/prism-language2.js"></script>
...
  1. 添加需要高亮的代码块:
<pre><code class="language-html"> <!-- 添加语言类型 -->
&lt;!doctype html&gt;
&lt;html&gt;
  &lt;head&gt;
    &lt;title&gt;Page Title&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;

    &lt;h1&gt;This is a Heading&lt;/h1&gt;
    &lt;p&gt;This is a paragraph.&lt;/p&gt;

  &lt;/body&gt;
&lt;/html&gt;
</code></pre>
  1. 初始化 Prism:
Prism.highlightAll(); // 自动高亮所有代码块

以上是 Prism.js 的简单使用示例,你可以根据需求自定义语言和主题。