#小書匠語法使用手冊

title: 小書匠語法使用手冊
tags: 小書匠,語法,MARKDOWN,幫助
grammar_abbr: true
grammar_table: true
grammar_defList: true
grammar_emoji: true
grammar_footnote: true
grammar_ins: true
grammar_mark: true
grammar_sub: true
grammar_sup: true
grammar_checkbox: true
grammar_mathjax: true
grammar_flow: true
grammar_sequence: true
grammar_plot: true
grammar_code: true
grammar_highlight: true
grammar_html: true
grammar_linkify: true
grammar_typographer: true
grammar_video: true
grammar_audio: true
grammar_attachment: true
grammar_mermaid: true
grammar_classy: true
grammar_cjkEmphasis: true
grammar_cjkRuby: true
grammar_center: true
grammar_align: true
grammar_tableExtra: true

常用語法

標題

這是 H1 一級標題
======
這是 H2 二級標題
------
# 這是 H1 一級標題
## 這是 H2 二級標題
### 這是 H3 三級標題
#### 這是 H4 四級標題
##### 這是 H5 五級標題
###### 這是 H6 六級標題

快捷鍵: [ctrl + h]

列表

無序列表

* 項目1
  * 子項目1.1
  * 子項目1.2
    * 子項目1.2.1
* 項目2
* 項目3

+ 項目1
  + 子項目1.1
  + 子項目1.2
    + 子項目1.2.1
+ 項目2
+ 項目3

- 項目1
  - 子項目1.1
  - 子項目1.2
    - 子項目1.2.1
- 項目2
- 項目3

快捷鍵: [ctrl + u]

有序列表

1. 項目1
2. 項目2
3. 項目3
    1. 項目3.1
    2. 項目3.2

1. 項目1
1. 項目2
1. 項目3
    1. 項目3.1
    1. 項目3.2

有序列表起始編號

58. 項目5
2. 項目6

快捷鍵: [ctrl + o]

鏈接

[鏈接名稱](鏈接地址)
[鏈接名稱][1]
[1] : 鏈接地址

圖片

![名稱](鏈接地址)
![名稱][1]
[1] : 鏈接地址

文字格式

**這是文字粗體格式**

__這是文字粗體格式__

*這是文字斜體格式*

_這是文字斜體格式_

引用

> 第一行引用文字
> 第二行引用文字

水平線

***

GFM擴展語法

表格

First Header  | Second Header
------------- | -------------
Content Cell  | Content Cell
Content Cell  | Content Cell

增強型表格

|First Header  | Second Header ||
|First Header  | Second Header | Third Header|
|------------- | -------------|-------------|
表身1Content Cell  | Merge Content Cell||
Content Cell  | Content Cell| Content Cell|

表身2Content Cell  | Merge Content Cell||
Content Cell  | Content Cell| Content Cell|
[表格標題]

代碼

行內(nèi)代碼

`var x = "hello world"`

塊代碼

```javascript
var a = "hello world";
var b = "good luck";
```

自動轉(zhuǎn)換成超鏈接

系統(tǒng)將自動根據(jù)內(nèi)容，將地址轉(zhuǎn)換成超鏈接格式

http://markdown.xiaoshujiang.com

HTML

<div class="hey">Hello world</div>

支持的html標簽

刪除線

~~在文字上添加刪除線~~

擴展語法

目錄

[toc]

擴展的文字格式

++插入的文字++

==被記號的文字==

上角文字: 19^th^

下角文字: H~2~O

印刷字替換

系統(tǒng)將自動替換下列文字，轉(zhuǎn)換成排版系統(tǒng)使用的符號

(c) (C) (r) (R) (tm) (TM) (p) (P) +-

縮寫定義

The HTML specification
is maintained by the W3C.
*[HTML]: Hyper Text Markup Language
*[W3C]:  World Wide Web Consortium

待辦事項

-[ ] 未完成事項
-[ ] 未完成事項
-[x] 完成事項
-[X] 完成事項

腳注

腳注[^1x]
[^1x]: 腳注的用法

定義

蘋果
: 一種水果
: 一種品牌，計算機，手持設備
桔子
: 一種水果

公式

行內(nèi)公式

這是行內(nèi)公式`!$ \Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,. $`

塊公式

```mathjax!
$$\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.$$
```

流程圖 (語法)

```flow
st=>start: 開始
e=>end: 結(jié)束
op=>operation: 操作步驟
cond=>condition: 是 或者 否?

st->op->cond
cond(yes)->e
cond(no)->op
```

序列圖 (語法)

```sequence
小明->小李: 你好 小李, 最近怎么樣?
Note right of 小李: 小李想了想
小李-->小明: 還是老樣子
```

小書匠編輯器擴展語法

塊代碼內(nèi)文字格式

塊代碼高亮標記

```javascript
var >>==hello==<< = 'hello world'
```

塊代碼刪除線

```javascript
var >>~~hello~~<< = 'hello world'
```

塊代碼加粗

```javascript
var >>**hello**<< = 'hello world'
```

塊代碼下橫線

```javascript
var >>++hello++<< = 'hello world'
```

小書匠編輯器提供了附件管理功能，用戶可通過./對附件的引用，比如圖片./jiangzhu.jpg。附件的上傳需通過工具欄的插入圖片ctrl+g，插入視頻ctrl+shift+v，插入音頻ctrl+shift+a，插入附件ctrl+shift+t功能鍵進行操作。

視頻

%[名稱](鏈接地址)
%[名稱][1]
[1] : 鏈接地址

音頻

~[名稱](鏈接地址)
~[名稱][1]
[1] : 鏈接地址

附件

=[名稱](鏈接地址)
=[名稱][1]
[1] : 鏈接地址

元數(shù)據(jù)

元數(shù)據(jù)必須放置在每篇文章的開頭才能生效。如果文章里有元數(shù)據(jù)時，系統(tǒng)將自動以元數(shù)據(jù)的標題為準，用戶通過文章信息的維護界面修改的標題及tags將會被覆蓋掉。

---
title: 小書匠語法使用手冊
tags: 小書匠,語法,MARKDOWN,幫助
---

mermaid流程圖，序列圖，甘特圖（mermaid語法）

```mermaid!
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
```

統(tǒng)計圖 （統(tǒng)計圖語法）

數(shù)據(jù)格式為：{"data": [], "options":{}}
系統(tǒng)使用jquery.parseJSON()函數(shù)進行解析，因此代碼必須符合該函數(shù)的要求才能正常解析。

```plot!
{
"data": [ [[0, 0], [1, 1]] ],
"options": { "yaxis": { "max": 1 } }
}
```

自定義class

## 自定義class {class名稱}

通過自定義的class名稱后，你就可以在每篇文章的自定義css里添加自己想要的樣式了．

cjk強調(diào)

_這里將顯示帶有襯線字體效果的中文做為強調(diào)_

cjk注音標示

{需要被注音標示的內(nèi)容}(注音標示)
{需要被注音標示的內(nèi)容}[編號]
[編號]: 注音標示

居中顯示文字

->居中顯示的文字<-

對齊顯示文字

:>居左顯示的文字<-
->居右顯示的文字<:
:>兩端對齊顯示的文字<:
->居中顯示的文字<-

注： 該語法與center語法沖突，兩種語法同時開啟時，align語法將覆蓋center語法。

示例

[toc]

[圖片上傳失敗...(image-10d5ca-1513230389049)]

http://www.github.com/suziwen/markdownxiaoshujiang
http://www.xiaoshujiang.com

這是 H1 一s級標題

這是 H2 二級標題

這是 H3 三級標題

這是 H4 四級標題

這是 H5 五級標題
這是 H6 六級標題

視頻

%電影

音頻

~音樂

附件

=附件

待辦事項

-[ ] 未完成事項
-[x] 完成事項
-[X] 完成事項

縮寫定義

The HTML specification
is maintained by the W3C.

*[HTML]: Hyper Text Markup Language
*[W3C]: World Wide Web Consortium

印刷字替換

(c) (C) (r) (R) (tm) (TM) (p) (P) +-

html代碼

<div>html代碼</div>

流程圖 (語法)

st=>start: 開始
e=>end: 結(jié)束
op=>operation: 操作步驟
cond=>condition: 是 或者 否?

st->op->cond
cond(yes)->e
cond(no)->op

序列圖 (語法)

小明->小李: 你好 小李, 最近怎么樣?
Note right of 小李: 小李想了想
小李-->小明: 還是老樣子

腳注[1]

表格Tables

First Header Second Header
Content Cell Content Cell
Content Cell Content Cell

定義

蘋果
: 一種水果
: 一種品牌，計算機，手持設備

桔子
: 一種水果

文字格式

這是文字粗體格式

這是文字粗體格式

這是文字斜體格式

這是文字斜體格式

在文字上添加刪除線

++插入的文字++

==被記號的文字==

上角文字: 19th

下角文字: H2O

無序列表

  • 項目1
    • 子項目1.1
    • 子項目1.2
      • 子項目1.2.1
  • 項目2
  • 項目3

有序列表

  1. 項目1
  2. 項目2
  3. 項目3
    1. 項目3.1
    2. 項目3.2

有序列表起始編號

  1. 項目5
  2. 項目6

圖片

[圖片上傳失敗...(image-d9136e-1513230389049)]
鏈接

鏈接名稱

引用

第一行引用文字
第二行引用文字

水平線

代碼

行內(nèi)代碼

var x = "hello world"

塊代碼

/**
 * @author John Smith <john.smith@example.com>
 * @version 1.0
*/
package l2f.gameserver.model;

import >>++java.util.ArrayList++<<;

>>~~public abstract class L2Character {~~<<
>>++public abstract class L2Character extends L2Object {++<<
  public static final Short ABNORMAL_EFFECT_BLEEDING = 0x0_0_0_1; // not sure

  public void moveTo(int x, int y, int z) {
    _ai = null;
    _log.warning("Should not be called");
    if (1 > 5) {
      return;
    }
  }

  /** Task of AI notification */
  @SuppressWarnings( { "nls", "unqualified-field-access", "boxing" })
  >>==public class NotifyAITask implements Runnable {
    private final CtrlEvent _evt;

    List<String> mList==<< = new ArrayList<String>()

    public void run() {
      try {
        getAI().notifyEvent(_evt, _evt.class, null);
      } catch (Throwable t) {
        t.printStackTrace();
      }
    }
  }
}

塊代碼內(nèi)文字格式

塊代碼高亮標記

  var >>==hello==<< = 'hello world'

塊代碼刪除線

  var >>~~hello~~<< = 'hello world'

塊代碼加粗

  var >>**hello**<< = 'hello world'

塊代碼下橫線

  var >>++hello++<< = 'hello world'

顯示行號

var x = 1;
var z = 'str';

高亮指定行

var x = 1;
var y = 2;
var z = 3;
var u = 4;
var w = 5;
var a = 6;

顯示行號并從指定行數(shù)計數(shù)

var x = 1;

禁用顯示行號

var x = 1;

公式

行內(nèi)公式

這是行內(nèi)公式!$ \Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,. $

塊公式

$$\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.$$

帶編號的公式

!$\eqref{ref1}$

\begin{equation}
\int_0^\infty \frac{x^22}{e^x-1}\,dx = \frac{\pi^4}{15}\label{ref1}
\end{equation}

!$\eqref{ref1}$

統(tǒng)計圖

{
"data": [ [[0, 0], [1, 1]] ],
"options": { "yaxis": { "max": 1 } }
}

mermaid流程圖，序列圖，甘特圖

流程圖

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

序列圖

sequenceDiagram
A->> B: Query
B->> C: Forward query
Note right of C: Thinking...
C->> B: Response
B->> A: Forward response

甘特圖

gantt
        dateFormat  YYYY-MM-DD
        title Adding GANTT diagram functionality to mermaid
        section A section
        Completed task            :done,    des1, 2014-01-06,2014-01-08
        Active task               :active,  des2, 2014-01-09, 3d
        Future task               :         des3, after des2, 5d
        Future task2               :         des4, after des3, 5d
        section Critical tasks
        Completed task in the critical line :crit, done, 2014-01-06,24h
        Implement parser and jison          :crit, done, after des1, 2d
        Create tests for parser             :crit, active, 3d
        Future task in critical line        :crit, 5d
        Create tests for renderer           :2d
        Add to mermaid                      :1d

PPT語法

使用

 
 ----

作為一個水平頁分割線，注意在----前后都需要空一行

使用

 
 --

作為一個垂直頁分割線, 注意在--前后都需要空一行

通過如下形式

<!-- .element: class="fragment" data-fragment-index="1" -->

可以實現(xiàn)fragment顯示效果

注：　在演示文檔模式下，toc和腳注語法將失效.

emoji表情語法

Classic markup: :wink: :crush: :cry: :tear: :laughing: :yum:

Shortcuts (emoticons): :-) :-( 8-) ;)

自定義class

自定義class用例{green}

你可以通過查看生成的html代碼里，在h4里找到名為green的class名稱．

cjk強調(diào)

這里將顯示中文襯線字體做為強調(diào)樣式

cjk注音標示

{小}(xiao){書}(shu){匠}(jiang)

居中顯示

->居中顯示的{文字}(wenzi)<-

->[圖片上傳失敗...(image-e60719-1513230389049)]<-

文字對齊

:>居左顯示的文字<-

->居右顯示的文字<:

:>兩端對齊顯示的文字<:

->居中顯示的文字<-

增強型表格

First Header Second Header Third Header
表身1Content Cell Merge Content Cell
Content Cell Content Cell Content Cell

|First Header | Second Header ||

First Header Second Header Third Header
表身1Content Cell Merge Content Cell
Content Cell Content Cell Content Cell

表身2Content Cell | Merge Content Cell||
Content Cell | Content Cell| Content Cell|
[表格標題]

  1. 腳注的用法 ?

?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容