highlight.js 作為網頁語法高亮度顯示， highlight.js 為基於 BSD 的開放原始碼軟體，有如下兩種利用方式

1. 安裝到自己的網站
2. 從程式碼分享網站外連到自己的網站

第一種方式就是下載原始碼，然後把原始碼安裝到自己的網站，下載網址如下

• Getting highlight.js

依網頁指示勾選自己需要的語言項目，然後到底下點擊 Download ，就可以下載原始碼了，接著在網頁中使用以下的 HTML 標籤，分別是一個 <link> 及兩個 <script>

<link rel="stylesheet" href="/path/to/styles/default.css">
<script src="/path/to/highlight.pack.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

以上 <link> 是連結到 CSS 檔案，其中 /path/to/styles/ 為網站中存取 CSS 檔案的路徑，而第一個 <script> 則是連結到 JavaScript 檔案，同樣 /path/to/ 為網站中存取 JavaScript 程式的路徑，至於第二個 <script> 為 JavaScript 程式碼，用途為在網頁於用戶端瀏覽器載入後，啟動語法高亮度的 JavaScript 程式。

第二種方式也就是把原始碼上傳到程式碼分享網站，然後外連到自己的網站， highlight.js 官網的下載網頁提供了兩個 CDNs 的外連連結，其中之一如下網址

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/default.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>

highlight.js 截至 9.12.0 版支援 172 種語言及 79 種樣式，以上分享網站僅支援 23 種常見語言，所以要外連還是自己內建，就看自己建站的需求了。

然後在網頁內顯示程式碼的語法高亮度要用 <pre> 及 <code> 把程式碼包起來，並利用 <code> 的 class 屬性指定語言，例如以下為 C 的 Hello C! 程式

#include <stdio.h>

int main()
{
    printf("Hello C!\n");
    return 0;
}

注意左角括號或稱小於符號 < 要用 &lt; 代替，右角括號或稱大於符號 > 要用 &gt; 代替，因此以上完整的 HTML 碼為

<pre>
<code class="c">#include &lt;stdio.h&gt;

int main()
{
    printf("Hello C!\n");
    return 0;
}</code></pre>

之所以要做替換是因為瀏覽器預設把角括號當 HTML 的標籤，所以如果沒有做替換的話，很可能在瀏覽器解譯的時候會出錯。

更多用法的細節，請參考 highlight.js 官網的說明

• How to use highlight.js

更多支援語言及樣式，請參考 highlight.js 官網的 Demo

• highlight.js demo