这是一篇markdown测试文章

# 这是一级标题

这是一级标题

## 这是二级标题

这是二级标题

### 这是三级标题

这是三级标题

#### 这是四级标题

这是四级标题

##### 这是五级标题

这是五级标题

###### 这是六级标题

这是六级标题

我是普通字体
我是普通字体
**我是粗体**
我是粗体
__我也是粗体__
我也是粗体
*我是斜体*
我是斜体
_我也是斜体_
我也是斜体
***我是粗体+斜体***
我是粗体+斜体
___我也是粗体+斜体___
我也是粗体+斜体

1
2
3
- 横杠列表1
- 横杠列表2
- 横杠列表3
  • 横杠列表1
  • 横杠列表2
  • 横杠列表3
1
2
3
* 星号列表1
* 星号列表2
* 星号列表3
  • 星号列表1
  • 星号列表2
  • 星号列表3
1
2
3
+ 加好列表1
+ 加好列表2
+ 加好列表3
  • 加好列表1
  • 加好列表2
  • 加好列表3
1
2
3
1. 序号1
2. 序号2
3. 序号3
  1. 序号1
  2. 序号2
  3. 序号3

[这是超链接](https://www.brian-zzh.cn/)
这是超链接

1
2
# 这里內链接,只要在C:\blog\HEXO\source\_posts目录下有这个md文件名,就能创建超链接。
{% post_link 在阿里云上部署hexo-基于CentOS超明细操作方法 %}
hexo + next主题 自购域名+HTTPS超详细部署方法在CentOS(服务端)+Windows(客户端)

代码块

我是代码,前面有四个空格

我是代码前的
$(document).ready(function () { alert('RUNOOB'); });
我是代码后的

1
2
3
4
5
6
7
1. 序号1
- 嵌套序号1
- 嵌套序号2
2. 序号2
* 嵌套列表1
* 嵌套列表2
3. 序号3
  1. 序号1
    • 嵌套序号1
    • 嵌套序号2
  2. 序号2
    • 嵌套列表1
    • 嵌套列表2
  3. 序号3
1
2
3
4
5
6
> 这是一级引用
>
>> 继续二级引用
>>
>>>还是三级引用

这是一级引用

继续二级引用

还是三级引用

图片

格式是这样的:
![路飞](./images/这是一篇markdown测试文章/海贼王.jpg)
hexo对png格式的图片支持不好,建议用jpg
效果是这样的:
路飞

#资源文件夹

资源图片(与资源文件夹一起使用)

资源图片是一种在_posts目录下跟文章md文件名字一样的文件夹中图片的引用显示方法。
语法:{% asset_img [class names] slug [width] [height] [title text [alt text]] %}
例子:{% asset_img mixue.jpg %}

下载(与资源文件夹一起使用)

配置文件下载路径的
{% asset_link 德勤-上市指南.pdf "《德勤-上市指南》点击下载" %}

《德勤-上市指南》点击下载

相对路径(与资源文件夹一起使用)

这是显示出所在网站目录的文件所在相对路径,不知道有啥用?可能是方便下载吧。
{% asset_path mixue.jpg %}

/2023/08/17/%E8%BF%99%E6%98%AF%E4%B8%80%E7%AF%87markdown%E6%B5%8B%E8%AF%95%E6%96%87%E7%AB%A0/mixue.jpg

代码块

1
2
print("Hello World")
# 这是代码块Python高亮的写法
1
2
SELECT * FROM TABLE;
-- 这也是代码快
SQL语法test.sql
1
SELECT * FROM TABLE;

B站嵌入视频方法(已经失效)

B站嵌入视频方法

1
2
3
4
5
6
7
8
<!-- B站的嵌入代码 -->
<iframe src="//player.bilibili.com/player.html?bvid=BV1aj421D7V5&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

<!-- HEXO的嵌入代码 -->
{% raw %}
<div style="position: relative; width: 100%; height: 0; padding-bottom: 75%;">
<iframe src="//player.bilibili.com/player.html?bvid=BV1aj421D7V5&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" style="position: absolute; width: 100%; height: 100%; Left: 0; top: 0;" ></iframe></div>
{% endraw %}

字体

黑体字
微软雅黑
华文彩云
蓝色
绿色
红色
尺寸
我是高亮

Next8主题特有html标签

高亮说明Note

这是Next8主题自带的html标签Note便签贴效果
修改next的_config.yml来启用
图形

1
2
3
4
5
6
7
8
9
10
11
12
13
# Note tag (bootstrap callout)
note:
# Note tag style values: 不同的显示风格
# - simple bootstrap callout old alert style. Default.
# - modern bootstrap callout new (v2-v3) alert style. 这个好看
# - flat flat callout style with background, like on Mozilla or StackOverflow.
# - disabled disable all CSS styles import of note tag.
style: modern
icons: true # 显示Note的图标,建议打开,好看
# Offset lighter of background in % for modern and flat styles (modern: -12 | 12; flat: -18 | 6).
# Offset also applied to label tag variables. This option can work with disabled note tag.
light_bg_offset: 0

default灰色要标记的内容

primary紫色要标记的内容

这里是标题

可以粗体 带上链接 Hexo!

点击打开

这是一个可以折叠的Note

Note with summary: note primary This is a summary

success绿色要标记的内容

info蓝色要标记的内容

warning橙色要标记的内容

danger红色要标记的内容

1
2
3
4
5
6
7
8
9
10
11
12
13
14
{% note default %} 灰色要标记的内容 {% endnote %}
{% note primary %} 紫色要标记的内容 {% endnote %}
{% note primary %}
#### 这里是标题
**可以粗体** 带上链接 [Hexo!](https://hexo.io)
{% endnote %}
{% note primary 点击打开 %}
#### 这是一个可以折叠的Note
Note with summary: `note primary This is a summary`
{% endnote %}
{% note success %} 绿色要标记的内容 {% endnote %}
{% note info %} 蓝色要标记的内容 {% endnote %}
{% note warning %} 橙色要标记的内容 {% endnote %}
{% note danger %} 红色要标记的内容 {% endnote %}

高亮画笔

这是默认黄色的高亮
这是primary紫色的高亮
这是success绿色的高亮,
这是info蓝色的高亮
这是warning橙色的高亮
这是danger红色的高亮
这是default灰色的高亮
这是mark html标签黄色高亮

1
2
3
4
5
6
7
8
这是默认:{% label @黄色的高亮 %}
这是primary:{% label primary@紫色的高亮 %}
这是success:{% label success@绿色的高亮, %}
这是info:{% label info@蓝色的高亮 %}
这是warning:{% label warning @橙色的高亮 %}
这是danger:{% label danger@红色的高亮 %}
这是default:{% label default @灰色的高亮 %}
这是mark html标签:<mark>黄色高亮</mark>

按钮

  • 怎样显示键盘操作:<kbd>Ctrl</kbd> + <kbd>C</kbd>
    Ctrl + C

  • 普通按钮:<button type="button">点击我!</button>

  • 黑色按钮:

    1
    2
    {% button #, 按钮 %}
    {% btn #, 简写代码按钮 %}
    按钮 简写代码按钮
  • 这是一个有icon的按钮:{% btn #,, home %}

  • 这是一个有icon+文字的按钮:{% btn #, 主页, home %}

    主页
  • 这是一个打开百度链接的按钮:<div class="text-center">{% btn https://www.baidu.com, Baidu, fa fa-desktop, Baidu %}</div>

超大按钮

超大的按钮,logo是用了text主题的source里面的

1
2
3
{% linkgrid %}
Baidu | https://www.baidu.com/ | 百度一下 | /images/apple-touch-icon-next.png
{% endlinkgrid %}

图形

(1)修改hexo的_config.yml文件来开放功能
图形

1
2
3
highlight:
exclude_languages:
- mermaid

(2)修改next的_config.yml文件来开放功能
图形

1
2
3
4
5
6
7
# Mermaid tag
mermaid:
enable: true
# Available themes: default | dark | forest | neutral
theme:
light: default
dark: dark

饼图

1
2
3
4
5
6
{% mermaid pie showData %}
title 2022年全国人口分布
"0-14岁" : 16.9
"15-64岁" : 68.2
"65岁以上" : 14.9
{% endmermaid %}
pie showData
title 2022年全国人口分布
"0-14岁" : 16.9
"15-64岁" : 68.2
"65岁以上" : 14.9

多页签

修改next的_config.yml来开放功能

1
2
3
4
5
6
7
# Tabs tag
tabs:
# Make the nav bar of tabs with long content stick to the top.
sticky: false
transition:
tabs: false
labels: true

在文章中插入如下代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
{% tabs Fourth unique name %}
<!-- tab 方案1 -->
这里是方案1的内容
<!-- endtab -->

<!-- tab 方案2 -->
这里是方案2的内容
<!-- endtab -->

<!-- tab 方案3 -->
这里是方案3的内容
<!-- endtab -->
{% endtabs %}

效果如下:

这里是方案1的内容
这里是方案2的内容
这里是方案3的内容

显示更多的语法
<!-- more -->

我是显示更多

这篇文章页写得不错:MarkDown语法超详细教程

百度一下,你就知道
知乎-有问题,就会有答案