【发布时间】:2019-01-04 18:16:23
【问题描述】:
我的 Jekyll 网站有两种内容:个人和专业。
我想通过动态 CSS 类强调访问者当前正在阅读的内容类型:
- 如果访问者在标记为“个人”的页面上,我的
<main>元素的类应该是"personal-content"。 - 如果访问者在标记为“专业”的页面上,我的
<main>元素的类应该是"professional-content"。 - 否则,类应为
"site-content"。
在每个页面的前端,我正在创建一个输出语句,我将其设置为"personal" 或"professional",例如:
---
content: "personal"
----
然后我在我的标签中使用这个输出语句,如下所示:(为了阅读目的而缩进)
<main
{% if page.content %}
class="{{ page.content }}-content"
{% else %}
class="site-content"
{% endif %}
>
但是,我只看到了 site-content 类的样式。我做错了什么?
【问题讨论】:
-
其他类(个人内容或专业内容)是否出现在 HTML 输出中?
-
{{ page.content | inspect }}可以为您提供有关正在发生的事情的线索。 -
感谢@APerson,我查看了生成的 HTML,发现这是我的开始
标签: <main class="。不仅自定义类设置不起作用,还会让我的页面变成无效的html。 -
@DavidJacquel 多亏了这一点,我想我明白了:Jekyll 已经在使用“内容”将降价文章包含到布局中! {{ 页面内容 |检查 }} 实际上返回了我页面的副本。
标签: html css jekyll liquid yaml-front-matter