Markdownの書き方ガイド

この記事は、ブログを書くときによく使うMarkdown記法のサンプルです。文章、見出し、画像、引用、表、コード、リストなどの書き方を確認できます。

見出し

見出しは # の数で大きさが変わります。記事のタイトルに近い内容ほど大きく、細かい説明ほど小さくします。

H1

H2

H3

H4

H5
H6

段落

通常の文章は、そのまま書くだけで段落になります。読みやすくするために、内容が変わるところで空行を入れるとよいです。

長い文章を一つの段落にまとめすぎると読みにくくなります。ひとつの段落では、ひとつの話題だけを書くようにすると整理しやすくなります。

画像

書き方

![代替テキスト](./画像へのパス)

表示例

ブログのサンプル画像

引用

引用は、他の文章やメモを紹介するときに使います。

出典なしの引用

書き方

> これは引用文です。  
> **Markdown記法**も引用の中で使えます。

表示例

これは引用文です。
Markdown記法も引用の中で使えます。

出典付きの引用

書き方

> 記憶を共有するのではなく、伝えることで記憶を共有する。<br>
> — <cite>Rob Pike[^1]</cite>

表示例

記憶を共有するのではなく、伝えることで記憶を共有する。
— Rob Pike1

表

書き方

| 斜体      | 太字     | コード |
| --------- | -------- | ------ |
| _斜体_    | **太字** | `code` |

表示例

斜体太字コード
斜体太字code

コードブロック

書き方

コードを表示するときは、3つのバッククォートで囲みます。最初のバッククォートのあとに html や javascript などの言語名を書くと、見やすく色分けされます。

```html
<!doctype html>
<html lang="ja">
  <head>
    <meta charset="utf-8" />
    <title>サンプル</title>
  </head>
  <body>
    <p>テスト</p>
  </body>
</html>
```

表示例

<!doctype html>
<html lang="ja">
  <head>
    <meta charset="utf-8" />
    <title>サンプル</title>
  </head>
  <body>
    <p>テスト</p>
  </body>
</html>

リスト

番号付きリスト

書き方

1. ひとつ目
2. ふたつ目
3. みっつ目

表示例

  1. ひとつ目
  2. ふたつ目
  3. みっつ目

箇条書きリスト

書き方

- 項目
- 別の項目
- さらに別の項目

表示例

  • 項目
  • 別の項目
  • さらに別の項目

入れ子のリスト

書き方

- 果物
  - りんご
  - みかん
  - バナナ
- 乳製品
  - 牛乳
  - チーズ

表示例

  • 果物
    • りんご
    • みかん
    • バナナ
  • 乳製品
    • 牛乳
    • チーズ

その他の記法

種類書き方表示例
略語<abbr title="HyperText Markup Language">HTML</abbr>HTML
下付き文字H<sub>2</sub>OH2O
上付き文字X<sup>2</sup>X2
キーボード<kbd>Ctrl</kbd> + <kbd>C</kbd>Ctrl + C
マーカー<mark>大切な部分</mark>大切な部分

Markdownだけでも、ブログ記事に必要な基本的な表現は十分に作れます。まずは見出しと段落から使い始めるのがおすすめです。

Footnotes

  1. 上記はRob Pikeの発表を参考にした引用例です。 ↩