gpt4 book ai didi

markdown - 如何在 docpad/markdown 中突出显示一段代码

转载 作者:行者123 更新时间:2023-12-02 21:36:41 24 4
gpt4 key购买 nike

我的博客使用 docpad + markdown。我用highlight.js plugin格式化代码示例。格式设置正常,关键字突出显示。现在,我想强调具有附加格式的代码块的某些部分,例如显示与前一个 block 相比我所做的更改。

是否可以突出显示代码块的某些部分,例如

  • 进行函数调用粗体
  • 删除某些文本
  • 将一些文字设为红色

这是它的样子 Martin Fowler's blog :

Martin Fowler's refactoring example

唯一的区别是我也想保持关键字突出显示。

最佳答案

根据 Docpad 的 list of Plugins你有几个选择。我快速浏览了一下下面列出的两个。可能还有其他我错过的。

  1. Highlight.js Plugin
  2. Pygments Plugin

如果您想自定义输出的外观,我怀疑您需要编辑任一插件使用的 CSS。请参阅您选择的特定插件的文档。

<小时/>

例如 Highligh.js 插件 docs声明您需要单独下载样式表(这可以解释为什么 OP 没有使用该插件获得任何样式)。查看提供的列表和演示,然后选择最适合您所需外观的样式。

下载CSS文件并保存到适当的目录。正如 Docpad 的 docs表明,这将位于 src/render/styles/filename.css 中,并确保将“filename.css”替换为文件名。正如文档所述:

Then, to include it in our pages, we'll update the styles Block in our default.html.eco layout to:

<%- @getBlock("styles").add(["/styles/style.css"]).toHTML() %>

再次强调,请务必使用文件的实际名称。

要对所使用的颜色/样式进行任何调整,您需要编辑该 CSS 文件。请注意,Highlight.js 提供了 list of class names您可以使用它来设计 Hook 。找到与您要调整的项目相匹配的特定类名称,并找到该类在 CSS 文件中的样式位置,然后进行编辑,直到您满意为止。

请注意,上述内容假设您使用默认设置和插件,如 DocPad 文档的“入门”页面中所述。 YMMV。

<小时/>

如果您想突出显示更改,则需要创建 diff您的更改,然后将“diff”定义为语言。然后,Highlight.js 将使用 diff荧光笔来突出显示更改。不幸的是,没有办法同时突出显示语言和突出显示差异。换句话说,您可以突出显示关键字,也可以突出显示更改,但不能同时突出显示两者。

当然,您可以随时define你自己的“语言”和register与Highlight.js 一起使用。但这超出了本论坛的范围。

关于markdown - 如何在 docpad/markdown 中突出显示一段代码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31492663/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com