圍欄代碼塊不突出正確

在化身，當我設置的降價轉換器kramdown和bundle exec jekyll serve，這種圍欄代碼塊圍欄代碼塊不突出正確

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

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

呈現這樣的： kramdown

這種情況不管我做。我試過設置input: GFM選項，但是它是否包含在內並沒有什麼不同。

然而，當我在減價轉換器設置爲隆重的接待，同樣的代碼塊呈現這樣的： 1 appearance

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

正如您從下面呈現的HTML中看到的那樣，代碼塊將被突出顯示。我正在使用Pygments的CSS樣式表，其中Rouge應該能夠使用它。我注意到div的類在Markdown轉換器之間改變了。使用kramdown時，其類爲.highlighter-rouge，而使用Redcarpet時，其類僅爲highlight。如果在Markdown轉換器之間切換，是否需要手動修改CSS？

Kramdown：

kramdown elements

隆重的接待：

1 elements

來源

2016-03-02 briennakh

你是否在GitHub頁面上託管？ – approxiblue

是的，我是@approxiblue。上面我的問題出現在我在當地服務的時候。 – briennakh

你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以進一步應用更改。

來源

2016-03-03 03:56:32 approxiblue

您的建議是從CSS中刪除所有'div'實例，以恢復語法高亮顯示。需要做更多的工作來獲得相同的邊距，填充等。我不知道我必須手動編輯樣式表 - 這是在降級轉換器之間切換過程的正常部分嗎？ – briennakh

我認爲這取決於。 Pygments樣式表[由代碼生成]（http://stackoverflow.com/a/14989819），這意味着它們在版本之間可能略有不同。有人[例如在這裏生成和存檔]（https://github.com/iwootten/jekyll-syntax）的CSS沒有div選擇器。你的樣式表是這樣的，它來自於一個主題，我不確定作者在什麼地方或者如何得到它。 – approxiblue

儘管如此，CSS仍然大部分是相似的，諸如'.kd'，'.nx'，'.p'等的選擇器應該保持不變，所以這裏和那裏的一些調整就足夠了。如果你願意，你也可以使用pygmentize來生成一個新的主題CSS。 – approxiblue

圍欄代碼塊不突出正確

回答

相關問題