Skip to content

Markdown

Shunya Hagiwara edited this page May 10, 2022 · 1 revision

Markdown の書きかた

Markdown (マークダウン) とは、シンプルな表記で「文章の構造をあらわす」ものです。Markdown 形式の文書に対応している GitHub や Hugo の入力欄では、ある特定のルールで書かれた文書を 自動的に美しく整形 して表示することができます。

見出しの書きかた

見出しはシャープ記号 # であらわします。 # のうしろに 半角スペース をいれ、見出し文言を置きます。# の数が増えるほど見出しレベルが小さくなります。

# 大見出し
## 中見出し
### 小見出し
#### もっと小見出し

出力結果

大見出し

中見出し

小見出し

もっと小見出し


箇条書き・リストの書きかた

箇条書きは、アスタリスク記号 * あるいはハイフン記号- であらわします。* のうしろに 半角スペース をいれ、箇条書きにしたい文言を置きます。行頭に半角スペース 4 つ以上をあけると、箇条書きを入れ子にすることができます。

* カレー
   * にんじん
   * たまねぎ
   * お肉
* サラダ
   * レタス
   * トマト
   * ドレッシング

出力結果

  • カレー
    • にんじん
    • たまねぎ
    • お肉
  • サラダ
    • レタス
    • トマト
    • ドレッシング

番号付き箇条書きの書きかた

箇条書きとほぼ同じです。 1. のように数字とピリオドで表します。

1. 下準備
    1. 野菜を洗う
    2. 野菜の皮をむく
    3. 肉を炒める
2. スパイス作り
    1. カルダモン・ナツメグなどをすりつぶす
    2. フライパンで炒る
    3. 油をくわえる

出力結果

  1. 下準備
    1. 野菜を洗う
    2. 野菜の皮をむく
    3. 肉を炒める
  2. スパイス作り
    1. カルダモン・ナツメグなどをすりつぶす
    2. フライパンで炒る
    3. 油をくわえる

文中の一部を装飾する

文中の一部の文字を太字、斜体、プログラム文字などを表現することができます。

アンダースコア記号 _ が斜体をあらわします。アスタリスク記号 2 つ ** が太字を表します。 バッククオート記号 ` がプログラム文字を表します。それぞれ前後に半角スペースをいれる必要があります。


文字を _斜体にしたい_ ときは、アンダースコア記号を使います。 **太字にしたい** ときはアスタリスクを二つ。 `プログラム文字` はバッククオートであらわします。日本語キーボードの場合、バッククオートは `shift` +  `@` で入力できます。

出力結果

文字を 斜体にしたい ときは、アンダースコア記号を使います。 太字にしたい ときはアスタリスクを二つ。 プログラム文字 はバッククオートであらわします。日本語キーボードの場合、バッククオートは shift + @ で入力できます。


引用文

引用文は「逆くの字」の記号 > であらわします。 > のうしろに 半角スペース をいれ、文言を置きます。> の数が増えるほど深い引用になります。

> A さんの発言
>> B さんの発言
>>> C さんの発言

出力結果

A さんの発言

B さんの発言

C さんの発言


リンク

リンクは記号 [文言](URL) であらわします。 []()の前後に 半角スペース をいれ、[] のなか文言を置きます。() のなかにリンク先のアドレスを記入します。

検索をしたいかたは [Google のウェブサイトへ](https://google.com) お願いします。

外部サイトへのリンクは、ブラウザの別のタブで開くように設定します。 その際はHTMLタグを使用し <a href="(ここにurlを記入)" target="_blank">(リンクの表示文言を記入)</a> のように記入します。

<a href="https://www.bunka.go.jp/" target="_blank">文化庁</a>

出力結果

検索をしたいかたは Google のウェブサイトへ お願いします。


画像

画像は記号 ![代替文言](URL) であらわします。 ![]()の前後に 半角スペース をいれ、[] のなか代替文言を置きます。代替文言は、読み上げブラウザなど画像が表示できない場合に利用されます。() のなかに画像のアドレスを記入します。

![はぎわらさん](https://avatars.githubusercontent.com/u/333662?s=120&v=4) 
画像は代表取締役社長の萩原氏

出力結果

はぎわらさん 画像は代表取締役社長の萩原氏

サイトコンテンツの中で画像にキャプションをつけたい場合は "キャプションの内容" のかなに記入してください

![はぎわらさん](https://avatars.githubusercontent.com/u/333662?s=120&v=4 "キャプションの内容")

水平線

水平線はハイフン記号 3 つ --- であらわします。


改行のかきかた

改行は Hugo や GitHub などによって、挙動がことなる場合があります。

一般的には、Markdown では改行を表すときに、行末に半角スペースを 2 ついれる ルールが用いられます。

一方で、GitHub のコメント欄では改行はそのまま反映されます。半角スペース 2 つや、 <br> タグを入れる必要はありません。

GitHub での文中改行のかきかた

とくに指定する必要がありません。

山路を登りながら、こう考えた。智に働けば角が立つ。
情に棹させば流される。意地を通せば窮屈だ。とかくに人の世は住みにくい。
住みにくさが高じると、安い所へ引き越したくなる。
どこへ越しても住みにくいと悟った時、詩が生れて、画が出来る。

一般的な Markdown での文中改行の書きかた

行末に半角スペース記号を二つ いれます。

山路を登りながら、こう考えた。智に働けば角が立つ。  👈半スペ2つ
情に棹させば流される。意地を通せば窮屈だ。とかくに人の世は住みにくい。  👈半スペ2つ
住みにくさが高じると、安い所へ引き越したくなる。  👈半スペ2つ
どこへ越しても住みにくいと悟った時、詩が生れて、画が出来る。