使用方式

1
{% note class_name %} Content (md partial supported) {% endnote %}

其中，class_name 可以是以下列表中的一个值：

  • default
  • primary
  • success
  • info
  • warning
  • danger

呈现效果

效果：

1
2
3
4
5
6
7
8
9
10
11
12
13
{% note default %} default {% endnote %}

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

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

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

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

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

{% note Content %} Content {% endnote %}

👇

default

primary

success

info

warning

danger

Content

用html的写法如下：

1
2
3
4
5
6
7
8
<div class="note default"><p>default</p></div>
<div class="note primary"><p>primary</p></div>
<div class="note success"><p>success</p></div>
<div class="note info"><p>info</p></div>
<div class="note warning"><p>warning</p></div>
<div class="note danger"><p>danger</p></div>
<div class="note danger no-icon"><p>danger no-icon</p></div>
<!-- 如果不想要标题可以在后面加上no-icon -->

default

primary

success

info

warning

danger

danger no-icon

使用[FA图标]

注：需要font-awesome插件支持

其中，替换第二个fa后面的值就可以显示对应的图标。FA图标查询点击这里。

1
2
3
4
5
6
<i class="fa fa-subway fa-2x"></i>
<i class="fa fa-camera-retro fa-lg"></i>
<i class="fa fa-camera-retro fa-2x"></i>
<i class="fa fa-camera-retro fa-3x"></i>
<i class="fa fa-camera-retro fa-5x"></i>
<i class="fa fa-play-circle fa-2x"></i>

👇