• Basic
• Table
• Picture
• Boxes
  • Notification
  • Warning
  • Error
• Mermaid
  • sequentialDiagram

对于不同的环境可能渲染效果不同，通过这篇 demo 可以简单看一下各种组件和扩展的渲染效果或者支持情况。

Basic

中文加粗 中文划线 中文删除线 中文倾斜

The quick brown fox jumps over a lazy dog.

The quick brown fox jumps over a lazy dog.

The quick brown fox jumps over a lazy dog.

The quick brown fox jumps over a lazy dog.

The quick brown fox jumps over a lazy dog.

Table

Here’s a useless table:

Picture

How about a yummy crepe?

It can also be centered!

Here’s a code chunk:

var foo = function(x) {
  return(x + 5);
}
foo(3)

And here is the same code with syntax highlighting:

var foo = function(x) {
  return(x + 5);
}
foo(3)

And here is the same code yet again but with line numbers:

1
2
3
4
var foo = function(x) {
  return(x + 5);
}
foo(3)

Boxes

You can add notification, warning and error boxes like this:

Notification

Note: This is a notification box.

Warning

Warning: This is a warning box.

Error

Error: This is an error box.

Mermaid

sequentialDiagram

sequenceDiagram
Alice ->> Bob: Hello Bob, how are you?
Bob-->>John: How about you John?
Bob--x Alice: I am good thanks!
Bob-x John: I am good thanks!
Note right of John: Bob thinks a long<br/>long time, so long<br/>that the text does<br/>not fit on a row.

Bob-->Alice: Checking with John...
Alice->John: Yes... John, how are you?