SyntaxHighlighter 是一款用于代碼高亮的 JavaScript 庫,它可以將代碼轉換成不同顏色和格式的標記,使得代碼更易于閱讀和理解。
以下是如何在網頁中使用 SyntaxHighlighter 的步驟:
首先需要下載 SyntaxHighlighter 庫文件,可以從官方網站 http://syntaxhighlighter.org/ 下載最新版本的文件。
將下載好的 SyntaxHighlighter 文件放到你的網站目錄中,然后在 HTML 文件中引入所需的 CSS 和 JS 文件。例如:
<link rel="stylesheet" href="path/to/shCore.css">
<link rel="stylesheet" href="path/to/shThemeDefault.css">
<script src="path/to/shCore.js"></script>
<script src="path/to/shBrushJavascript.js"></script>
其中 path/to/
為文件所在的路徑。
在 HTML 文件中需要高亮的代碼塊前添加一個 <pre>
標簽,并設置一個唯一的 class
屬性,例如:
<pre class="brush:javascript;">
// 你的 JavaScript 代碼
</pre>
其中 brush:javascript;
表示使用 JavaScript 語言高亮。
最后在 HTML 文件中添加一個 <script>
標簽,用于初始化 SyntaxHighlighter。例如:
<script>
SyntaxHighlighter.all();
</script>
這樣就可以在網頁中顯示高亮后的代碼了。