Question

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

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

我的文章通常包含很长的代码行，我想用自动换行显示它（所以可以看到它没有滚动）和行号（允许区分新行和单词warp）。

我发现，如果我对<pre>标记使用此css属性，我可以启用自动换行：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 documentation。

用于长线的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

Answer 2

你一定要看看http://prismjs.com/ 易于集成和完全可定制！：d

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

2 个答案: