css - 使用 redcarpet 在 jekyll 中突出显示语法

Question

我正在尝试让代码突出显示适用于使用 jekyll 构建的简单博客。我希望能够在用 markdown 编写的帖子中突出显示代码，因此我启用了 redcarpet 作为标记语言。这一切正常，代码在 <pre></pre> 中格式化标签和代码的所有不同元素都有相应的类。例如

<span class="n">function</span>
<span class="n">saySomething</span>
<span class="p">()</span>
<span class="p">{</span>

etc.

这太棒了，但这还没有给我们实际的突出显示(颜色)。所以我想必须有一些 css 准备好复制和粘贴，它实际上对不同的代码元素进行了样式设置。还是我完全错过了什么？

我研究了一些代码高亮库，例如 prettify或 prism但这些在浏览器中使用 javascript 进行自己的格式化。但由于 redcarpet 已经完成了格式化代码的繁重工作，因此没有必要再做一遍。

有什么提示吗？

Answer 1

您需要一些 CSS 魔法。使用 this one或 pick one from here .