Edited at 2018-02-17

Markdown記法一覧

More than 1 year has passed since last update.

markdownでmarkdownの書き方を記述しました。

Markdownとは

Markdown - Wikipedia

Markdown（マークダウン）は、文書を記述するための軽量マークアップ言語のひとつである。本来はプレーンテキスト形式で手軽に書いた文書からHTMLを生成するために開発されたものである。しかし、現在ではHTMLのほかパワーポイント形式やLATEX形式のファイルへ変換するソフトウェア（コンバータ）も開発されている。各コンバータの開発者によって多様な拡張が施されるため、各種の方言が存在する。

🎁 Block elements

💎 Paragraphs and Line Breaks - 改行

example.md

1行目(スペースを2つ入れる)

2行目

🎉 結果

1行目

2行目

💎 Headers - 見出し

example.md

# This is an H1

## This is an H2

###### This is an H6

🎉 結果

This is an H1

This is an H2

This is an H6

💎 Blockquotes - 引用

example.md

> "引用引用引用引用

引用引用"

>引用本文引用本文

>>入れ子

🎉 結果

>によって引用をすることができます

ダブルクォーテーション内は途中で改行されません

💎 Lists - リスト

Disc

example.md

* リスト1

    * リスト1-2  

* リスト2

🎉 結果

* リスト表示のルール

* タブを入れることで

* 階層表示が可能です

Decimal

example.md

1. リスト1-1

    2. リスト1-2  

2. リスト2

🎉 結果

1. リスト1

1. リスト1-1

2. リスト1-2

2. リスト2

Definition

example.md

<dl>

  <dt>オレオ</dt>

  <dd>クッキー&クリーム</dd>

  <dt>リッツ</dt>

  <dd>プレーンクラッカー</dd>

</dl>

🎉 結果

オレオ: クッキー&クリーム
リッツ: プレーンクラッカー

Checkbox

example.md

- [ ] リスト1

- [x] リスト2

🎉 結果

リスト1

リスト2

💎 Horizontal Rules - 水平線

3つ以上のハイフン、アスタリスク、アンダースコアをならべる。

example.md

    * * *  

    ***  

    *****  

    - - -  

    ———————————————————

🎉 結果

↓

🎁 Span Elements

💎 Links - リンク

自動リンク

example.md

<http://qiita.com>

🎉 結果

http://qiita.com

インライン記法

example.md

[Qiita](http://qiita.com)

[Qiita](http://qiita.com "Qiita")

🎉 結果

Qiita

Qiita (タイトル付き)

💎 Emphasis - 強調

example.md

*強調*

**強調**

***強調***

🎉 結果

アスタリスク
書体
表示

1つ
イタリック体
サンプル

2つ
Bold体
サンプル

3つ
イタリック&Bold体
サンプル

アスタリスク(*)だけでなくアンダースコア(_)でも同様の機能が使えます

💎 画像

example.md

![ダミー画像](http://placehold.it/100)

![ダミー画像](http://placehold.it/100 "ダミー画像")

🎉 結果

(タイトル付き)

💎 打ち消し

example.md

~~打ち消し~~

🎉 結果

~~打ち消し打ち消し打ち消し打ち消し~~

💎 注釈

example.md

　　　　本文本文本文\[^注釈]

　　　　\[^注釈]:注釈テキスト注釈テキスト注釈テキスト

🎉 結果

現実と理想は良く見れば隣り合わせ、いつだって自分次第でどっちにも手が届く。¹

🎁 Code

💎 コード表示

インライン

example.md

`$hoge = 1`

`.md`

🎉 結果

$hoge = 1 、 .md

シンタックスハイライト

記法

example.md

```html:sample

   <div class="radioWave">

      <p>迷いの中あてなく見上げた空彩る星たちが</p>

      <p>嘘みたいに晴れた朝に繋がることを教えてくれた</p>

   </div>

```(

🎉 結果

sample

<div class="radioWave">

  <p>迷いの中あてなく見上げた空彩る星たちが</p>

  <p>嘘みたいに晴れた朝に繋がることを教えてくれた</p>

</div>

🎁 Extra

💎 テーブル記法

example.md

| Left align | Right align | Center align |

|:-----------|------------:|:------------:|

| This       |        This |     This     |

| column     |      column |    column    |

| will       |        will |     will     |

| be         |          be |      be      |

| left       |       right |    center    |

| aligned    |     aligned |   aligned    |

🎉 結果

左寄せ
右寄せ
中央

コロンの位置で
テキストの位置を
指定できます

コード記法や
強調表示も
使用可能です

要素の前後には
必ずスペースを
入れましょう