是否可以根据单词更改Jekyll变量CSS
Shayrapet
我正在博客风格的网站上运行Jekyll。这是我现在显示的内容：
每篇带有摘录的精选帖子都在for循环中显示。
我试图找到一种方法来显示上述带下划线的单词，具体取决于类别。这是用于显示类别的代码（屏幕截图中带下划线的文本）：
<span class="cat">{{ post.category }}</span>
每个类别应基于类别具有不同的颜色背景。是否可以在HTML或CSS中实现if语句？
我已经编辑了页面源代码，以说明我希望显示的span元素如何理解我的意图。
逻辑：
If (page.category == "ethical"): css background: red
If (page.category == "writeup"): css background: grey
任何建议或指导都将非常有帮助。
共同设计师
尝试此操作您需要为所有类别创建CSS类
在CSS中：
/*
.background-<your category> {
background: <color you want>
}
*/
.background-ethical {
background: red
}
.background-writeup {
background: grey
}
内部循环：
<span class="cat background-{{ post.category }}">{{ post.category }}</span>
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
是否可以获取计算的vue变量以根据视口大小进行更改？
- 2
JLabel是否可以根据变量值更改其Text？
- 3
是否可以创建一个多列CSS页面，该页面根据页面和列的大小来包装单词？
- 4
根据CSS类更改SCSS变量
- 5
根据父类||更改CSS变量 Sass和Tailwind CSS
- 6
是否可以在Jekyll _config.yml中的变量内使用变量？
- 7
根据用户是否已注册更改php变量值
- 8
根据列表检查变量，并查看列表中的单词是否以变量开头
- 9
是否可以根据条件更新foldLeft函数中的变量？
- 10
在 C++ 中是否可以根据名称访问变量（内省）
- 11
是否可以根据查询值更改路线
- 12
是否可以根据change函数更改div的顺序？
- 13
是否可以根据方向更改javascript隐藏/显示div /查询
- 14
Pygame-是否可以根据时间更改背景图像？
- 15
Notepad ++是否可以根据当前文件类型更改主题
- 16
是否可以根据布局更改显示的弹性项目数量？
- 17
是否可以根据下拉列表中的所选值更改EL？
- 18
根据文件内容更改单词
- 19
如何根据 JavaScript 中变量的值更改 CSS 类？
- 20
根据变量更改库存
- 21
是否可以旋转单词的字符而不是使用css3旋转整个单词
- 22
是否可以在不知道的情况下遍历 jekyll 页面的 yaml 变量？
- 23
是否可以根据路线激活影响 html 标签的 css 类？
- 24
是否可以更改存储在shell变量中的日期格式？
- 25
在调试JavaScript时，是否可以更改变量值？
- 26
是否可以临时更改链接方法调用的实例变量？
- 27
是否可以在变量中动态更改类的名称？
- 28
是否可以在Makefile中打印变量并进行更改？
- 29
是否可以在Prolog中更改初始化变量？
我来说两句