Jekyll 在 Markdown 文档中给 <p>段落标签添加自定义 Class（也适用于ul,ol,table,h1-h6标签）

经验笔记
浏览 loading

Jekyll 虽然很老牌了但是真的很好用，很多很实用的功能其实都本身就已经实现了，只是官方文档可能没那么好找到，比如在 Markdown 文档中给内容增加 Class ，真个功能很多时候都非常实用，Jekyll 本身就实现了这个功能，而且使用起来也非常简单，看下文示例，轻松上手 Markdown 给标签添加 class。后续一极乐博客也会分享更多 jekyll 技巧。

1
2
{: .txt-yellow .bg-blue}
这个段落添加了2个自定义 Class，分别是 .txt-yellow（样式：黄色文字） 和 .bg-blue（样式：蓝色背景）

Markdown 解析后的代码结构

1
2
3
<p class="txt-yellow bg-blue">
这个段落添加了2个自定义 Class，分别是 .txt-yellow（样式：黄色文字） 和 .bg-blue（样式：蓝色背景）
</p>

ul 无序列表添加 Class 案例

1
2
3
4
{: .txt-yellow .bg-blue}
- 松鼠
- 老虎
- 老鼠

table 表格添加 Class 案例

1
2
3
4
5
{: .txt-yellow .bg-blue}
| 类型 | 标签 |
| -- | -- |
| span | 行内标签|
| p | 块标签 |

Relay Tips: 一极乐（ https://yijile.com/log/552/ ）