css - 如何在 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 前端的文件。在你的文件的开头粘贴一个front matter（即使它是空的）部分，Jekyll 会正确地转换它。尝试在文件开头使用它：

---
title: CSS stylesheet
---