标签插件

Note

配置项用法1用法2

参考链接 - Note (Bootstrap Callout)

# _config.butterfly.yml

note:
  style: flat # 标签样式
  icons: true # 是否显示图标
  border_radius: 3 # 边框圆角半径
  light_bg_offset: 0 # 背景色偏移量

语法框架

{% note [class] [no-icon] [style] %}
Any content (support inline tags too.io).
{% endnote %}

使用示例

{% note default %}
DEFAULT
{% endnote %}

{% note primary %}
PRIMARY
{% endnote %}

{% note success %}
SUCCESS
{% endnote %}

{% note info %}
INFO
{% endnote %}

{% note warning %}
WARNING
{% endnote %}

{% note danger %}
DANGER
{% endnote %}

渲染效果

DEFAULT

PRIMARY

SUCCESS

INFO

WARNING

DANGER

语法框架

{% note [color] [icon] [style] %}
Any content (support inline tags too.io).
{% endnote %}

使用示例

{% note default 'fab fa-cc-visa' %}
你是刷 Visa 还是 UnionPay
{% endnote %}

{% note pink 'fas fa-car-crash' %}
小心开车 安全至上
{% endnote %}

{% note red 'fas fa-fan' %}
这是三片呢？还是四片？
{% endnote %}

{% note purple 'far fa-hand-scissors' modern %}
剪刀石头布
{% endnote %}

{% note orange 'fas fa-battery-half' modern %}
电量剩余一半
{% endnote %}

{% note green 'fab fa-internet-explorer' modern %}
前端最讨厌的浏览器
{% endnote %}

渲染效果

你是刷 Visa 还是 UnionPay

小心开车 安全至上

这是三片呢？还是四片？

剪刀石头布

电量剩余一半

前端最讨厌的浏览器