Hexo写作样式简介 | 张扎瓦的博客

Hexo写作样式简介

使用Hexo中自带的写作样式,丰富文章表现形式


note标签

修改主题配置文件_config.yml

1
2
3
4
5
note:
style: flat
icons: true
border_radius: 3
light_bg_offset: 0

default

1
<div class="note default"><p>default</p></div>

primary

1
<div class="note primary"><p>primary</p></div>

success

1
<div class="note success"><p>success</p></div>

info

1
<div class="note info"><p>info</p></div>

warning

1
<div class="note warning"><p>warning</p></div>

danger

1
<div class="note danger"><p>danger</p></div>

tabs标签

选项卡 1

选项卡 2

这是选项卡 3

上面的,3表示打开页面时,默认展示第三个选项卡

1
2
3
4
5
6
7
8
9
10
11
{% tabs 选项卡, 3 %}
<!-- tab -->
**选项卡 1**
<!-- endtab -->
<!-- tab -->
**选项卡 2**
<!-- endtab -->
<!-- tab -->
**这是选项卡 3**
<!-- endtab -->
{% endtabs %}

图标

  1. 照相机
  2. 电池

hexo 使用的是fontawesome图标,直接引用就可以

1
2
1. <i class="fa fa-camera"></i> 照相机
2. <i class="fa fa-battery-4"></i> 电池

按钮

google一下
1
{% btn https://www.google.com, google一下,  google fa-fw %}
如果我的文章对您有所帮助,不妨打赏一杯豆浆以资鼓励(○` 3′○)