Hi, the world, I’m coooooooooming.

Oooops, just examples, ignore me, darling.

Heading 1，目录 1 #

Heading 2，目录 2 #

Heading 3，目录 3 #

Heading 4，目录 4 #

Heading 5，目录 5 #

Heading 6，目录 6 #

Tables，表格 #

kramdown 默认支持表格，只需要设置好 table thead tbody th tr td 对应的属性即可。

如下是 github 上的测试表格。

Code Snippets，代码高亮显示 #

Syntax highlighting via Pygments. css java sh c gas asm cpp c++

199
200
201
202
203
204
205
206
207
208

#container {
	float: left;
	margin: 0 -240px 0 0;
	width: 100%;
}
#container {
	float: left;
	margin: 0 -240px 0 0;
	width: 100%;
}

int main()
{
	return 0;
}

// Javascript code with syntax highlighting.
var fun = function lang(l) {
  dateformat.i18n = require('./lang/' + l)
  return true;
}

Long, single-line code blocks should not wrap. They should horizontally scroll if they are too long. This line should be long enough to demonstrate this.

The final element.

Non Pygments code example

<div id="awesome">
    <p>This is great isn't it?</p>
</div>

当屏幕太窄时采用滑动方式，防止代码换行导致不便于查看。

Reference，引用 #

如下是一个简单的链接 an example，当然也可以使用网站的相对路径 About Me 。

也可以将网站的引用与 URL 分别区分开，如下是其中的示例，而且不区分大小写，RTEMS、Linux、GUN、GUN 。

Lists，列表 #

Unordered Lists，无序列表 #

• level 1 item
  • level 2 item
  • level 2 item
    • level 3 item
    • level 3 item
• level 1 item
  • level 2 item
  • level 2 item
  • level 2 item
• level 1 item
  • level 2 item
  • level 2 item
• level 1 item

如下是三种不同的表达方式。

Unordered Lists 1 #

• Item one
• Item two
• Item three

Unordered Lists 2 #

• Item one
• Item two
• Item three

Unordered Lists 3 #

• Item one
• Item two
• Item three

其它 #

如下列表项中，各项之间表示为段落，而之前的不是，也就是说添加了 <p></p> ，所以现在看起来各个段之间空隙有点大。

• Item one

• Item two

• Item three

Ordered Lists，有序列表 #

有序表的表达方式，只与顺序相关，而与列表前的数字无关。

Ordered Lists 1 #

1. Item one
   1. sub item one
   2. sub item two
   3. sub item three
2. Item two

Ordered Lists 2 #

1. Item one
2. Item two
3. Item three

Ordered Lists 3 #

3. Item one
4. Item two
5. Item three

Lists Tips，列表补记 #

列表项目标记通常是放在最左边，但是其实也可以缩进，最多 3 个空格，项目标记后面则一定要接着至少一个空格或制表符。

• Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
• Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse id sem consectetuer libero luctus adipiscing.

如下显示相同。

• Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
• Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse id sem consectetuer libero luctus adipiscing.

如下是在同一列表中，显示两个段落。

1. This is a list item with two paragraphs. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.

   Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus. Donec sit amet nisl. Aliquam semper ipsum sit amet velit.

2. Suspendisse id sem consectetuer libero luctus adipiscing.

   This is the second paragraph in the list item. You’re only required to indent the first line. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.

Separator，分割线 #

下面的效果是相同的。

原始代码如下。

* * *

***

*****

- - -

---------------------------------------

The Fonts， 字体设置 #

This is emphasized 斜体. This is also emphasized 还是斜体.

Strong font 粗体 Also strong font 还是粗体

strikethrough 中间被画了个横线

Water is H₂O. 4²=16. 上标、下标测试。

Code Use the printf() function，代码模块。

Code Use the printf() function，与上面功能一样。

There is a literal backtick (`) here.，额，还是代码模块。

The New York Times (That’s a citation). 引用测试，和斜体相似。

This is Underline. 下划线。

Block Quote，段引用 #

下面时关于段引用的测试。

单段的引用。Just one paragraph.

My conclusion after the trip was “well, now I know that there’s at least one company in the world that can succeed with the waterfall model” and I decided to stop bashing the waterfall model as hard as I usually do. Now, however, with all the problems Toyota are having, I’m starting to reconsider.q q q q q q q q q q q q q q qkkkkk

多段的引用，one more paragraphs.

My conclusion after the trip was “well, now I know that there’s at least one company in the world that can succeed with the waterfall model” and I decided to stop bashing the waterfall model as hard as I usually do. Now, however, with all the problems Toyota are having, I’m starting to reconsider.

My conclusion after the trip was “well, now I know that there’s at least one company in the world that can succeed with the waterfall model” and I decided to stop bashing the waterfall model as hard as I usually do. Now, however, with all the problems Toyota are having, I’m starting to .q q q q q

单段，但较为复杂的引用。

My conclusion after the trip was “well, now I know that there’s at least one company in the world that can succeed with the waterfall model” and I decided to stop bashing the waterfall model as hard as I usually do. Now, however, with all the problems Toyota are having, I’m starting to reconsider.

嵌套引用。

My conclusion after the trip was “well, now I know that there’s at least one company in the world

that can succeed with the waterfall model” and I decided to stop bashing the waterfall model as hard as I usually do. Now, how ever, with all the problems Toyota are having, I’m starting to re consider.

Pictures，图片显示 #

MathJax, 数学表达式 #

如下是一个数学表达式。

$$ x=\frac{-b\pm\sqrt{b^2-4ac}}{2a} $$

段内插入LaTeX代码是这样的：$\exp(-\frac{x^2}{2})$，试试看看吧

Short Codes #

details #

mermaid #

在 assets/js/mermaid.js 中可以对 mermaid 进行一些配置。

    
sequenceDiagram
Alice ->> Bob: Hello Bob
note over Bob: Who's this?
Bob ->> Alice: Hey
Alice ->> Alice: Work now
loop Working
    Bob ->> Alice: Task A
    Bob ->> Alice: Task B
    Alice ->> Bob: Finish B
    Alice ->> Bob: Finish A
end

  

除了传统的 ShortCode 方式，还可以通过代码段方式使用，这里通过 _markup 方式实现。

``` mermaid
sequenceDiagram
Alice ->> Bob: Hello Bob
```

tabs #

其中在 tabs 中需要通过 id 标识不同的标签信息，同时在每个 tab 中需要确保存在 label 用于显示，同时用 selected="true" 标识默认显示那个标签页。

int main() {
}

notice #

int main() {
}

扩展功能 #

任务列表 #

• Task A
• Task B
• Task C
• Task D

参考 #

• BrandColors 一些常见的配色。