https://im1.cc/tag/highlight-js/ https://im1.cc/Typecho/3.html 2024-04-22T10:01:00+08:00 下载 highlight.js首先，从 highlight.js 官方网站 下载 highlight.js 库的最新版本。将 highlight.js 添加到您的主题或插件中：将 highlight.js 的 CSS 和 JavaScript 文件添加到您的 Typecho 主题或插件中。您可以将这些文件放在主题的目录中，或者在 Typecho 插件中进行引用。在页面中引入 highlight.js在您的页面模板文件中，通过 Link 和 script 标签引入 highlight.js 的 CSS 和 JavaScript 文件。初始化 highlight.js在页面加载完成后，使用 JavaScript 初始化 highlight.js。您可以使用以下代码示例： document.addEventListener('DOMContentLoaded', (event) => { document.querySelectorAll('pre code').forEach((block) => { hljs.highlightBlock(block); }); }); 6.启用代码行号：若要显示代码行号，您可以在初始化 highlight.js 时，添加 line-numbers 类到代码块的 pre 标签中。例如：<pre><code class="language-html line-numbers"> <!-- Your code here --> </code></pre> 样式调整：根据您的需求，您可能需要调整 highlight.js 的样式以适应您的主题风格。保存更改：保存您对模板文件的更改并刷新页面，以查看代码高亮和行号是否正常显示。通过这些步骤，您应该能够在 Typecho 中使用 highlight.js 实现代码高亮并显示代码行号。请注意，确保您的主题或插件正确引入 highlight.js 并按照上述步骤进行设置。