如何在 github-pages 上使用 jekyll markdown 显示带有自动换行和行号的代码块

Question

我正在使用 github 页面来托管我的博客。它使用 GitHub Flaword Markdown。这是部分内容_config.yml：

markdown: kramdown
# Use Github Flavored Markdown
kramdown:
  input: GFM

我的文章经常包含很长的代码行，我想用自动换行（这样不用滚动就可以看到所有内容）和行号（允许区分新行和单词扭曲）来显示它。

我发现，如果我将这个 css 属性用于<pre>tag: ，我可以启用自动换行white-space: pre-wrap。但是如何显示行号？我正在寻找可以让我继续使用 github-pages 内置 jekyll 的解决方案，它会自动为我生成博客页面。

Answer 1

抱歉，在代码突出显示中换行长行不适用于行号。

{% highlight ruby linenos %}
def dosomething
  delegate :some, :thing, :with, :unicorns, :and, :shrimps => :yolo, :someother key => true, :maybeonemore => true
end
{% endhighlight %}

请参阅Jekyll 文档。

以及长行的 CSS 换行：

.highlight pre{
  white-space: pre-wrap;
}

但最终这个问题不能仅通过 jekyll 或 kramdown/rouge 配置来解决。

这是因为，行号堆叠在<td>代码附近<td>。

如果您可以换行代码，则行号不会相应地换行，最终结果如下：

  def foo
1    wrapped very long line
2  wrapped very long line continues here
3
  end