example

Markdown是一种轻量级的「标记语言」。

1 Markdown语法教程

1.1 标题

不同数量的#可以完成不同的标题.。

1.2 字体

粗体、斜体、粗体和斜体，删除线，需要在文字前后加不同的标记符号。如下：

这个是粗体

这个是斜体

这个是粗体加斜体

这里是删除线

注：如果想给字体换颜色、字体或者居中显示，需要使用内嵌HTML来实现。

1.3 无序列表

无序列表的使用，在符号-后加空格使用。如下：

• 无序列表 1
• 无序列表 2
• 无序列表 3

如果要控制列表的层级，则需要在符号-前使用空格。如下：

• 无序列表 1
• 无序列表 2
  • 无序列表 2.1
  • 无序列表 2.2

1.4 有序列表

有序列表的使用，在数字及符号.后加空格后输入内容，如下：

1. 有序列表 1
2. 有序列表 2
3. 有序列表 3

1.5 引用

引用的格式是在符号>后面书写文字。如下：

读一本好书，就是在和高尚的人谈话。 ——歌德

雇用制度对工人不利，但工人根本无力摆脱这个制度。 ——阮一峰

1.6 链接

particlex

1.7 图片

1.8 分割线

可以在一行中用三个以上的减号来建立一个分隔线，同时需要在分隔线的上面空一行。如下：

1.9 表格

可以使用冒号来定义表格的对齐方式，如下：

1.10 代码块

如果在一个行内需要引用代码，只要用反引号引起来就好，如下：

Use the printf() function.

在需要高亮的代码块的前一行及后一行使用三个反引号，同时第一行反引号后面表示代码块所使用的语言，如下：

// FileName: HelloWorld.java
public class HelloWorld {
  // Java 入口程序，程序从此入口
  public static void main(String[] args) {
    System.out.println("Hello,World!"); // 向控制台打印一条语句
  }
}
java

<hello>
	<world></world>
</hello>
xml

2 其他语法

2.1 HTML

支持原生 HTML 语法，请写内联样式，如下：

<span style="display: block; text-align: center; color: orangered">橙色居中</span>
md

效果(橙色居中)：

2.2 Mdx

Caution

在 mdx 中必须使用 React 语法，例如 class 需要写成 className, style需要提供一个对象而不是直接的字符串。

由于使用 SSR 渲染，所以无法绑定事件。

支持 mdx + tailwindcss.

基础使用

<dib className="text-orange-500 text-right">hello</dib>
html

效果(橙色居右)：

图表

由于 mermaid 不支持 SSR，所以使用了支持 SSR 的 Pintor 来绘制流程图(使用时记得左边至少有一个缩进，否则可能会报错)。

<PintoraDiagram code={`
  activityDiagram
  title: Activity Example
  start
  partition Init {
    :read config;
    :init internal services;
    note left: init themes
  }
  :Diagram requested;
  if (diagram registered ?) then
    :get implementation;
  else (no)
    :print error;
  endif
  switch ( renderer type )
  case ( svg )
    :Generate svg;
  case ( canvas )
    :Draw canvas;
  case ( custom )
    :Custom renderer output;
  endswitch
  while (data available?) is (可用)
    :read data;
    :generate diagrams;
  endwhile (no)
  end
`}/>
html

效果：

列出页面

有些时候我们可能想要自动搜索某个目录中的页面，然后将其列出，这样就不用手动去维护链接了。