如何在css文件中使用Jekyll baseurl

Question

我正在使用Jekyll在Github页面上托管一个站点.问题在于引用css文件中的文件路径.

我想做这样的事情:

body { {background: #FFF url('{{ site.baseurl}}/images/page_bg.JPG') center 0 no-repeat; background-attachment: fixed; color: #4b595f; }

但似乎Jekyll不会处理css文件,因此site.baseurl永远不会被换出.

在其他情况下,我不能将其更改为内联样式,因此假设不可能.

Answer 1

使用Brian Willis回答的技巧不适用于SASS in @import-ed文件.

相反,你可以这样做:

main.scss

---
---
$baseurl: "{{ site.baseurl }}";
@import "myfile";

_sass/_myfile.scss

myclass {
  background: url($baseurl + "/my/image.svg");
}

别忘了

• 周围的引号"{{ site.baseurl }}"(在空的情况下很重要site.baseurl,可能更强大)和
• 加号$baseurl + "/my/image.svg".

Answer 2

Jekyll 处理所有具有 YAML 开头内容的文件。在文件的开头粘贴一个前文部分（即使它是空的），Jekyll 会正确地转换它。尝试在文件的开头使用它：

---
title: CSS stylesheet
---