围栏代码块不突出正确

Question

在化身，当我设置的降价转换器kramdown和bundle exec jekyll serve，这种围栏代码块

```javascript 
function hey(name) { 
    return 'Hey ' + name; 
} 

console.log(hey('Brienna')); 
``` 

呈现这样的：

这种情况不管我做。我试过设置input: GFM选项，但是它是否包含在内并没有什么不同。

然而，当我在减价转换器设置为隆重的接待，同样的代码块呈现这样的：

这是我希望看到的！但我不想使用Redcarpet。我想使用kramdown。

正如您从下面呈现的HTML中看到的那样，代码块将被突出显示。我正在使用Pygments的CSS样式表，其中Rouge应该能够使用它。我注意到div的类在Markdown转换器之间改变了。使用kramdown时，其类为.highlighter-rouge，而使用Redcarpet时，其类仅为highlight。如果在Markdown转换器之间切换，是否需要手动修改CSS？

Kramdown：

隆重的接待：

Answer 1

你Pygments来做CSS文件看起来像这样：

.highlight { font-size: 13px; } 
div.highlight, div.highlight code, div.highlight pre { background: #29281e; } 
div.highlight code { padding: 0; } 
div.highlight .c { color: #75715e } /* Comment */ 

在Kramdown输出时，.highlight块没有更长一个<div>，所以只需从CSS中删除所有“div”实例即可恢复语法突出显示。

红利：没有专门针对<div>，您的CSS现在可以与两个Markdown处理器的输出一起工作。

---

对于围栏代码块Kramdown工作，你需要打开recognition of GitHub Flavored Markdown：

kramdown: 
    input: GFM 

注意杰奇在执行时读取_config.yml只有一次。您需要重新启动jekyll serve以进一步应用更改。