📝 Block Elements

Headers 見出し

先頭に#をレベルの数だけ記述します。

# 見出し1
## 見出し2
### 見出し3
#### 見出し4
##### 見出し5
###### 見出し6

見出し3

見出し4

見出し5

見出し6

Block 段落

空白行を挟むことで段落となります。aaaa

段落1
(空行)
段落2

段落1

段落2

Br 改行

改行の前に半角スペースを2つ記述します。
この挙動は、オプションで変更可能です

hoge
fuga(スペース2つ)
piyo

hoge
fuga
piyo

Blockquotes 引用

先頭に>を記述します。ネストは>を多重に記述します。

> 引用
> 引用
>> 多重引用

引用
引用

多重引用

Code コード

`バッククオート` 3つ、あるいはチルダ~３つで囲みます。

print 'hoge'

シンタックスハイライトとファイル名

highlight.js Demo の common カテゴリ内の言語に対応しています

```javascript:mersenne-twister.js
function MersenneTwister(seed) {
  if (arguments.length == 0) {
    seed = new Date().getTime();
  }

  this._mt = new Array(624);
  this.setSeed(seed);
}
```

mersenne-twister.jsfunction MersenneTwister(seed) {
  if (arguments.length == 0) {
    seed = new Date().getTime();
  }

  this._mt = new Array(624);
  this.setSeed(seed);
}

インラインコード

`バッククオート` で単語を囲むとインラインコードになります。

これは `インラインコード`です。

これは インラインコードです。

pre 整形済みテキスト

半角スペース4個もしくはタブで、コードブロックをpre表示できます

    class Hoge
        def hoge
            print 'hoge'
        end
    end

class Hoge
    def hoge
        print 'hoge'
    end
end

Hr 水平線

アンダースコア_ 、アスタリスク*を3つ以上連続して記述します。

***
___
---

📝 Typography

強調

em

アスタリスク*もしくはアンダースコア_1個で文字列を囲みます。

これは *イタリック* です
これは _イタリック_ です

これは イタリック です
これは イタリック です

strong

アスタリスク*もしくはアンダースコア_2個で文字列を囲みます。

これは **ボールド** です
これは __ボールド__ です

これは ボールド です
これは ボールド です

em + strong

アスタリスク*もしくはアンダースコア_3個で文字列を囲みます。

これは ***イタリック＆ボールド*** です
これは ___イタリック＆ボールド___ です

これは イタリック＆ボールド です
これは イタリック＆ボールド です

📝 Images

![Alt文字列](URL) で<img>タグを挿入できます。

![Minion](https://octodex.github.com/images/minion.png)
![Stormtroopocat](https://octodex.github.com/images/stormtroopocat.jpg "The Stormtroopocat")

Minion
Stormtroopocat

画像の大きさなどの指定をする場合はimgタグを使用します。

<img src="https://octodex.github.com/images/dojocat.jpg" width="200px">

📝 Link

Markdown 標準

[表示テキスト](URL)でリンクに変換されます。

[Google](https://www.google.co.jp/)

Google

Crowi 互換

[/Sandbox]
&lt;/user/admin1>

[/Sandbox]
</user/admin1>

Pukiwiki like linker

(available by weseek/growi-plugin-pukiwiki-like-linker
)

最も柔軟な Linker です。
記述中のページを基点とした相対リンクと、表示テキストに対するリンクを同時に実現できます。

[[./Bootstrap3]]
Bootstrap3のExampleは[[こちら>./Bootstrap3]]

../user
Bootstrap3のExampleはこちら

📝 Lists

Ul 箇条書きリスト

ハイフン-、プラス+、アスタリスク*のいずれかを先頭に記述します。
ネストはタブで表現します。

- リスト1
    - リスト1_1
        - リスト1_1_1
        - リスト1_1_2
    - リスト1_2
- リスト2
- リスト3

リスト1
- リスト1_1
  - リスト1_1_1
  - リスト1_1_2
- リスト1_2
リスト2
リスト3

Ol 番号付きリスト

番号.を先頭に記述します。ネストはタブで表現します。
番号は自動的に採番されるため、すべての行を1.と記述するのがお勧めです。

1. 番号付きリスト1
    1. 番号付きリスト1-1
    1. 番号付きリスト1-2
1. 番号付きリスト2
1. 番号付きリスト3

番号付きリスト1
1. 番号付きリスト1-1
2. 番号付きリスト1-2
番号付きリスト2
番号付きリスト3

タスクリスト

- [ ] タスク 1
    - [x] タスク 1.1
    - [ ] タスク 1.2
- [x] タスク2

タスク 1
- タスク 1.1
- タスク 1.2
タスク2

📝 Table

Markdown 標準

| Left align | Right align | Center align |
|:-----------|------------:|:------------:|
| This       | This        | This         |
| column     | column      | column       |
| will       | will        | will         |
| be         | be          | be           |
| left       | right       | center       |
| aligned    | aligned     | aligned      |

OR

Left align | Right align | Center align
:--|--:|:-:
This       | This        | This
column     | column      | column
will       | will        | will
be         | be          | be
left       | right       | center
aligned    | aligned     | aligned

Left align	Right align	Center align
This	This	This
column	column	column
will	will	will
be	be	be
left	right	center
aligned	aligned	aligned

TSV (crowi-plus 独自記法)

::: tsv
Content Cell 	Content Cell
Content Cell 	Content Cell
:::

::: tsv
Content Cell Content Cell
Content Cell Content Cell
:::

TSV ヘッダ付き (crowi-plus 独自記法)

::: tsv-h
First Header	Second Header
Content Cell	Content Cell
Content Cell	Content Cell
:::

::: tsv-h
First Header Second Header
Content Cell Content Cell
Content Cell Content Cell
:::

CSV (crowi-plus 独自記法)

::: csv
Content Cell,Content Cell
Content Cell,Content Cell
:::

::: csv
Content Cell,Content Cell
Content Cell,Content Cell
:::

CSV ヘッダ付き (crowi-plus 独自記法)

::: csv-h
First Header,Second Header
Content Cell,Content Cell
Content Cell,Content Cell
:::

::: csv-h
First Header,Second Header
Content Cell,Content Cell
Content Cell,Content Cell
:::

📝 Footnote

脚注への参照¹を書くことができます。また、インラインの脚注^[インラインで記述できる脚注です]を入れる事も出来ます。

長い脚注は²のように書くことができます。

📝 Emoji

See emojione

😃 😄 😆 😇 🤤

👨‍👩‍👦 :family_man_boy: :family_man_girl: :family_man_girl_girl: :family_woman_girl_girl:

👍 👎 👐 🙌 👉

🍎 🍏 🍓 🍰 🍔

🏀 🏈 ⚾ 🏐 🎱

♥️ 💔 💓 💗 💟

⌚ ⚙️ 💎 🔧 ✉️

📝 Math

See MathJax .

Inline Formula

When $a \ne 0$ , there are two solutions to (ax^2 + bx + c = 0) and they are
$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$

The Lorenz Equations

\begin{align} \dot{x} & = \sigma(y-x) \\ \dot{y} & = \rho x - y - xz \\ \dot{z} & = -\beta z + xy \end{align}

The Cauchy-Schwarz Inequality

\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)

A Cross Product Formula

\mathbf{V}_1 \times \mathbf{V}_2 = \begin{vmatrix} \mathbf{i} & \mathbf{j} & \mathbf{k} \\ \frac{\partial X}{\partial u} & \frac{\partial Y}{\partial u} & 0 \\ \frac{\partial X}{\partial v} & \frac{\partial Y}{\partial v} & 0 \\ \end{vmatrix}

The probability of getting $\left(k\right)$ heads when flipping $\left(n\right)$ coins is:

P(E) = {n \choose k} p^k (1-p)^{ n-k}

An Identity of Ramanujan

\frac{1}{(\sqrt{\phi \sqrt{5}}-\phi) e^{\frac25 \pi}} = 1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}} {1+\frac{e^{-8\pi}} {1+\ldots} } } }

A Rogers-Ramanujan Identity

1 + \frac{q^2}{(1-q)}+\frac{q^6}{(1-q)(1-q^2)}+\cdots = \prod_{j=0}^{\infty}\frac{1}{(1-q^{5j+2})(1-q^{5j+3})}, \quad\quad \text{for $|q|<1$}.

Maxwell's Equations

\begin{align} \nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \\ \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\ \nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\ \nabla \cdot \vec{\mathbf{B}} & = 0 \end{align}

📝 UML Diagrams

See PlantUML .

シーケンス図

@startuml
skinparam sequenceArrowThickness 2
skinparam roundcorner 20
skinparam maxmessagesize 60
skinparam sequenceParticipant underline

actor User
participant "First Class" as A
participant "Second Class" as B
participant "Last Class" as C

User -> A: DoWork
activate A

A -> B: Create Request
activate B

B -> C: DoWork
activate C
C --> B: WorkDone
destroy C

B --> A: Request Created
deactivate B

A --> User: Done
deactivate A

@enduml

クラス図

@startuml

class BaseClass

namespace net.dummy #DDDDDD {
.BaseClass <|-- Person
Meeting o-- Person

.BaseClass <|- Meeting

}

namespace net.foo {
net.dummy.Person <|- Person
.BaseClass <|-- Person

net.dummy.Meeting o-- Person
}

BaseClass <|-- net.unused.Person

@enduml

コンポーネント図

@startuml

package "Some Group" {
HTTP - [First Component]
[Another Component]
}

node "Other Groups" {
FTP - [Second Component]
[First Component] --> FTP
}

cloud {
[Example 1]
}

database "MySql" {
folder "This is my folder" {
[Folder 3]
}
frame "Foo" {
[Frame 4]
}
}

[Another Component] --> [Example 1]
[Example 1] --> [Folder 3]
[Folder 3] --> [Frame 4]

@enduml

ステート図

@startuml
scale 600 width

[] -> State1
State1 --> State2 : Succeeded
State1 --> [] : Aborted
State2 --> State3 : Succeeded
State2 --> [] : Aborted
state State3 {
state "Accumulate Enough Data\nLong State Name" as long1
long1 : Just a test
[] --> long1
long1 --> long1 : New Data
long1 --> ProcessData : Enough Data
}
State3 --> State3 : Failed
State3 --> [] : Succeeded / Save Result
State3 --> [] : Aborted

@enduml

📝 blockdiag

See blockdiag .

blockdiag

::: blockdiag
blockdiag {
A -> B -> C -> D;
A -> E -> F -> G;
}
:::

seqdiag

::: seqdiag
seqdiag {
browser -> webserver [label = "GET /index.html"];
browser <-- webserver;
browser -> webserver [label = "POST /blog/comment"];
webserver -> database [label = "INSERT comment"];
webserver <-- database;
browser <-- webserver;
}
:::

actdiag

::: actdiag
actdiag {
write -> convert -> image

lane user {
label = "User"
write [label = "Writing reST"];
image [label = "Get diagram IMAGE"];
}
lane actdiag {
convert [label = "Convert reST to Image"];
}
}
:::

nwdiag

::: nwdiag
nwdiag {
network dmz {
address = "210.x.x.x/24"

  web01 [address = "210.x.x.1"];
  web02 [address = "210.x.x.2"];

}
network internal {
address = "172.x.x.x/24";

  web01 [address = "172.x.x.1"];
  web02 [address = "172.x.x.2"];
  db01;
  db02;

}
}
:::

rackdiag

::: rackdiag
rackdiag {
// define height of rack
8U;

// define rack items
1: UPS [2U];
3: DB Server
4: Web Server
5: Web Server
6: Web Server
7: Load Balancer
8: L3 Switch
}
:::

packetdiag

::: packetdiag
packetdiag {
colwidth = 32
node_height = 72

0-15: Source Port
16-31: Destination Port
32-63: Sequence Number
64-95: Acknowledgment Number
96-99: Data Offset
100-105: Reserved
106: URG [rotate = 270]
107: ACK [rotate = 270]
108: PSH [rotate = 270]
109: RST [rotate = 270]
110: SYN [rotate = 270]
111: FIN [rotate = 270]
112-127: Window
128-143: Checksum
144-159: Urgent Pointer
160-191: (Options and Padding)
192-223: data [colheight = 3]
}
:::

1つめの脚注への参照です。 ↩
脚注を複数ブロックで書く例です。

後続の段落はインデントされて、前の脚注に属します。 ↩

目次

📝 Block Elements

Headers 見出し

見出し3

見出し4

見出し5

見出し6

Block 段落

Br 改行

Blockquotes 引用

Code コード

シンタックスハイライトとファイル名

インラインコード

pre 整形済みテキスト

Hr 水平線

📝 Typography

強調

em

strong

em + strong

📝 Images

📝 Link

Markdown 標準

Crowi 互換

Pukiwiki like linker

📝 Lists

Ul 箇条書きリスト

Ol 番号付きリスト

タスクリスト

📝 Table

Markdown 標準

TSV (crowi-plus 独自記法)

TSV ヘッダ付き (crowi-plus 独自記法)

CSV (crowi-plus 独自記法)

CSV ヘッダ付き (crowi-plus 独自記法)

📝 Footnote

📝 Emoji

📝 Math

Inline Formula

The Lorenz Equations

The Cauchy-Schwarz Inequality

A Cross Product Formula

The probability of getting (k)\left(k\right)(k) heads when flipping (n)\left(n\right)(n) coins is:

An Identity of Ramanujan

A Rogers-Ramanujan Identity

Maxwell's Equations

📝 UML Diagrams

シーケンス図

クラス図

コンポーネント図

ステート図

📝 blockdiag

blockdiag

seqdiag

actdiag

nwdiag

rackdiag

packetdiag

Footnotes

The probability of getting $\left(k\right)$ heads when flipping $\left(n\right)$ coins is: