1.1 徽章(badge)


徽章(badge)简码用于在文本中显示小标记,颜色、标题和图标,可调整。

重要 版本6.6.6 船长 信息新增 超棒!

用法

{{% badge %}}重要{{% /badge %}}
{{% badge style="primary" title="版本" %}}6.6.6{{% /badge %}}
{{% badge style="red" icon="angle-double-up" %}}船长{{% /badge %}}
{{% badge style="info" %}}新增{{% /badge %}}
{{% badge color="fuchsia" icon="fab fa-hackerrank" %}}超棒{{% /badge %}}

参数

名称注释
style徽章使用的样式方案。

- 严重程度: info, note, tip, warning
- 印记颜色:primary, secondary, accent
- 颜色: blue, green, grey, orange, red
- 特殊颜色: default, transparent, code
color要使用的 CSS 颜色值。如果未设置,则选择的颜色取决于样式。任何给定的值都将覆盖默认值。

- 对于严重性样式:严重性匹配的漂亮颜色
- 对于所有其他样式:相应的颜色
title屏幕提醒标题的任意文本。根据样式的不同,可能会有一个默认标题。任何给定的值都将覆盖默认值。

- 对于严重性样式:严重性匹配的标题
- 对于所有其他样式:<空>

如果您不希望严重性样式的标题,则必须将此参数设置为" "(一个充满空格的非空字符串)。
iconFont Awesome icon name 设置在标题的左侧。根据样式的不同,可能会有一个默认图标。任何给定的值都将覆盖默认值。

- 对于严重性样式:严重性匹配的漂亮图标
- 对于所有其他样式:<空>

如果您不想为严重性样式使用图标,则必须将此参数设置为" "(填充空格的非空字符串)
<txt>任意文本,可以为 <空>

案例

样式

严重性样式

{{% badge style="info" %}}New{{% /badge %}}
{{% badge style="note" %}}Change{{% /badge %}}
{{% badge style="tip" %}}Optional{{% /badge %}}
{{% badge style="warning" %}}Breaking{{% /badge %}}
信息New 注释Change 提示Optional 警告Breaking

印记样式

{{% badge style="primary" icon="bullhorn" title="Announcement" %}}命令{{% /badge %}}
{{% badge style="secondary" icon="bullhorn" title="Announcement" %}}选项{{% /badge %}}
{{% badge style="accent" icon="bullhorn" title="Announcement" %}}专辑{{% /badge %}}
公告命令 公告选项 公告专辑

颜色样式

{{% badge style="blue" icon="palette" title="Color" %}}蓝色{{% /badge %}}
{{% badge style="green" icon="palette" title="Color" %}}绿色{{% /badge %}}
{{% badge style="grey" icon="palette" title="Color" %}}灰色{{% /badge %}}
{{% badge style="orange" icon="palette" title="Color" %}}橘色{{% /badge %}}
{{% badge style="red" icon="palette" title="Color" %}}红色{{% /badge %}}
Color蓝色 Color绿色 Color灰色 Color橘色 Color红色

特殊颜色

{{% badge style="default" icon="palette" title="Color" %}}默认色{{% /badge %}}
{{% badge style="transparent" icon="palette" title="Color" %}}透明色{{% /badge %}}
Color默认色 Color透明色

变体

没有图标和标题

{{% badge %}}6.6.6{{% /badge %}}
{{% badge style="info" icon=" " title=" " %}}Awesome{{% /badge %}}
{{% badge style="red" %}}Captain{{% /badge %}}
6.6.6 Awesome Captain

没有图标

{{% badge title="Version" %}}6.6.6{{% /badge %}}
{{% badge style="info" icon=" " %}}Awesome{{% /badge %}}
{{% badge style="red" title="Rank" %}}Captain{{% /badge %}}
Version6.6.6 信息Awesome RankCaptain

没有标题

{{% badge icon="star" %}}6.6.6{{% /badge %}}
{{% badge style="info" title=" " %}}Awesome{{% /badge %}}
{{% badge style="red" icon="angle-double-up" %}}Captain{{% /badge %}}
6.6.6 Awesome Captain

有标题和图标

{{% badge icon="star" title="Version" %}}6.6.6{{% /badge %}}
{{% badge style="info" %}}Awesome{{% /badge %}}
{{% badge style="red" icon="angle-double-up" title="Rank" %}}Captain{{% /badge %}}
Version6.6.6 信息Awesome RankCaptain