1. header不同大小展示

Header1

Header2

Header3

Header4

Header5

2. blod&斜体&引用&代码块等效果展示

ttttest😊😸(^▽^)tttttt 对比不加粗效果
我是斜体文件balabala

我是一段引用balabnala

我是一个🔗
我是一段单行代码

helloworld我是代码块

• 我是无序号表单
• 我是表单2balabal

1. 我是有序号表单
2. 我是序号2

我是删除效果文字

• 我是tasklist
• todododododo

3. 表格展示

后端开发	前端开发	测试人员
接口文档管理	接口文档管理	接口调试
接口调试	接口数据 Mock	接口自动化测试
接口自动化测试	接口调试
后端代码自动生成	前端代码自动生成

引用格式

新编辑器新支持特性（旧版本编辑器不支持）
1.时序图支持
2.公式支持
3.告示效果支持
4.折叠块支持

这是一个正文

这是一个正文加粗

这是一个斜体效果

项目内跳转

跳转到指定接口

变量提取_表达式使用变量

跳转到指定文档

文档跳转_338429

外部链接跳转

My favorite markdown editor is ByteMD.

插入图片

代码效果

添加底色的代码效果

代码块效果

import gfm from '@bytemd/plugin-gfm'
import { Editor, Viewer } from 'bytemd'

const plugins = [
  gfm(),
  // Add more plugins here
]

const editor = new Editor({
  target: document.body, // DOM to render
  props: {
    value: '',
    plugins,
  },
})

editor.on('change', (e) => {
  editor.$set({ value: e.detail.value })
})

无序列表

• First item
• Second item
• Third item

有序列表

1. First item
2. Second item
3. Third item

这是删除线效果

任务列表

• Write the press release
• Update the website
• Contact the media

表格样式

Syntax	Description
Header	Title
Paragraph	Text

Math Equation 公式的显示

Inline math equation: a+b

\displaystyle \left( \sum_{k=1}^n a_k b_k \right)^2 \leq \left( \sum_{k=1}^n a_k^2 \right) \left( \sum_{k=1}^n b_k^2 \right)

Gemoji

Thumbs up: 👍, thumbs down: 👎.

Families: 👨‍👨‍👦‍👦

Long flags: 🏴󠁧󠁢󠁷󠁬󠁳󠁿, 🏴󠁧󠁢󠁳󠁣󠁴󠁿, 🏴󠁧󠁢󠁥󠁮󠁧󠁿.

Mermaid Diagrams 逻辑图示

11W3新版本支持，之前旧版本不支持

graph TD;
  A-->B;
  A-->C;
  B-->D;
  C-->D;

插入Admonitions（告示）

插入HTML元素（折叠块）

Details 元素示例

嵌套的下拉栏！

这是详情内容

点我！内含惊喜……

😲😲😲😲😲

流媒体（暂时不支持）

HTML5 Video

支持普通的视频链接，如 https://xxx/movie.mp4，必须以 http或https开头，以常用的视频扩展名结尾； mp4|flv|ogg|avi|mov|wmv
@

Bilibili

@bilibili
@bilibili

---

id: head-metadata
title: Head 元数据

这是个苹果 🍎 这是个橙子 🍊 这是个香蕉 🍌

function HelloCodeTitle(props) {
  return <h1>你好，{props.name}</h1>;
}

console.log('每个仓库都应该有个吉祥物。');

<-- Prettier 不会动这个 -->

:::note Hello world:::

I = \int_0^{2\pi} \sin(x)\,dx

graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;

Footnotes （注脚的禁用效果）

Here's a simple footnote,¹ and here's a longer one.²

Footnotes

1. This is the first footnote. ↩

2. Here's one with multiple paragraphs and code.

   Indent paragraphs to include them in the footnote.

   { my code }

   Add as many paragraphs as youAlike. ↩