Css Jekyll-代码块背景颜色不一致_Css_Sass_Jekyll_Minima

Css Jekyll-代码块背景颜色不一致

css sass jekyll

Css Jekyll-代码块背景颜色不一致,css,sass,jekyll,minima,Css,Sass,Jekyll,Minima,我有一个Jekyll网站，我正在本地运行，bundle exec-Jekyll-serve，使用Minima默认主题当我使用代码块时，框的背景颜色与框中文本的背景颜色不同，导致了难看的显示： ```r filter(grepl("A", Source)) %>% group_by(Source) %>% summarise(Amount = sum(Amount)) %>% mutate(Percentage = Amount / sum(Amount) * 100) ```

我有一个Jekyll网站，我正在本地运行，

bundle exec-Jekyll-serve

，使用

Minima

默认主题

当我使用代码块时，框的背景颜色与框中文本的背景颜色不同，导致了难看的显示：

```r
filter(grepl("A", Source)) %>%
group_by(Source) %>%
summarise(Amount = sum(Amount)) %>%
mutate(Percentage = Amount / sum(Amount) * 100)
```

对于我在代码块开头定义的大多数语言，以及没有定义任何语言时（例如，

``r

，

``python

``

），都会出现此问题，但有趣的是，对于

``shell脚本

，则不会出现此问题

相关的

\u sass/minima/\u base.scss

部分（我认为）如下所示：

/**
 * Blockquotes
 */
blockquote {
  color: $grey-color;
  border-left: 4px solid $grey-color-light;
  padding-left: $spacing-unit / 2;
  @include relative-font-size(1.125);
  letter-spacing: -1px;
  font-style: italic;

  > :last-child {
    margin-bottom: 0;
  }
}



/**
 * Code formatting
 */
pre,
code {
  @include relative-font-size(0.9375);
  border: 1px solid $grey-color-light;
  border-radius: 3px;
  background-color: #e6e6e6;
}

code {
  padding: 1px 5px;
}

pre {
  padding: 8px 12px;
  overflow-x: auto;

  > code {
    border: 0;
    padding-right: 0;
    padding-left: 0;
  }
}

如何使整个代码块使用当前仅用于文本背景的灰色？

编辑：禁用胭脂语法高亮显示后，代码块将正确显示，同时语法高亮显示

编辑：当使用github页面构建网站时，也会出现此问题。

查看生成的HTML。你看到了什么？FWIW，我个人更喜欢像

{%highlight somelanguage%}

这样的东西，但从来没有遇到过这个问题。就像“shell脚本”出现得很正确：code，但是“r”将每个单词放在自己的标签中：code当我禁用它时，它看起来好像与胭脂语法荧光灯有关，代码块显示正确，但我没有语法Highlighting是的，highlighter添加了所有这些跨度。它们中的每一个都可以有不同的文本颜色、字体等，这取决于它的类别，您应该在CSS文件中为HTML定义它们。没有高亮显示，没有语法高亮显示。顺便说一句，我喜欢红布胜过胭脂。它还知道Delphi，这是我的主要语言。看看生成的HTML。你看到了什么？FWIW，我个人更喜欢像

{%highlight somelanguage%}