Question

我正在寻找如何在css文件中使用Liquid作为我的背景图像路径的答案，并希望可以在localhost和Github上同时看到图像。

第一个背景路径仅适用于Github，第二个仅适用于localhost。有没有办法实现我想要的，而不是每次我承诺Github时都没有注释掉代码？我想也许我需要使用{{%%}}所以我从Jekyll阅读文档并寻找答案但仍然没有运气。

CSS

---
---

.content-wrapper {
  max-width: 800px;
  margin: 0 auto;
  height: 2600px;
  background: url({{site.baseurl}}/_site/assets/img/dummy_blog_content.jpg);
  background: url({{site.url}}{{site.baseurl}}/assets/img/dummy_blog_content.jpg);
}

YML

baseurl: /project
exclude: ["README.md"]

Answer 1

您可以使用absolute_url自动将url和base_url添加到液体但中，这应该在模板中完成：

{{ "/assets/style.css" | absolute_url }}

生成的url中不应包含_site，因为这在Github页面中不起作用。 在您的模板中，请参阅您的css位置，在本例中为/assets/style.css：

<link rel="stylesheet" href="{{ '/assets/style.css' | absolute_url }}">

在Jekyll环境中使用css文件中的液体

1 个答案: