マークダウン記法

基本

  • 見出し
    • H1 # H1 見出し
    • H2 ## H2 見出し
    • H3 ### H3 見出し
    • H4 #### H4 見出し
    • H5 ##### H5 見出し
    • H6 ###### H6 見出し
  • 箇条書き/リスト
    • 順序なし * 項目 もしくは - 項目
    • 番号付き 1. 項目2. 項目、…
  • 区切り/水平線/ヘアライン --- もしくは ***
  • リンク
    • URL のみのリンク <https://example.com>
    • テキストリンク [Example](https://example.com)
  • 斜体/イタリック体 *斜体* もしくは _斜体_
  • 太字/強調 **太字** もしくは __太字__
  • 太字の斜体 ***太字の斜体*** もしくは ___太字の斜体___
  • 打ち消し線 ~~訂正~~
  • 引用 > 吾輩は猫である。名前はまだ無い。
  • コード `printf("Hello, World.\n");`
  • 画像の埋め込み ![画像](img/picture.jpg)
  • エスケープ \#タグ

参考:

Basic Syntax | Markdown Guide

使い方

参考:

Markdown 記法一覧 – Qiita

Markdown 記法 サンプル集 – Qiita

Markdown 記法/書き方 – 見出し/表/リンク/画像/文字色など | NotePM

.md ファイルの書き方 – ncxx-sl-lab/members Wiki – GitHub

導入

参考:

Markdown 入門 | Amitica

画像を挿入する

![画像の説明](URL) の形式で画像を挿入する。

![焼きそば](https://upload.wikimedia.org/wikipedia/commons/thumb/c/c5/Kuroishi_Yakisoba01.JPG/640px-Kuroishi_Yakisoba01.JPG)Code language: Markdown (markdown)

参考:

画像を表示する方法 | バヤシタ

コードブロック/シンタックスハイライト

コンテンツをコードブロックとして扱うには、バッククォート3つで囲む。最初のバッククォート3つの後に文法に基づいてハイライトする言語を指定する。

```Ruby
print "Hello"
```Code language: Markdown (markdown)

参考:

Markdown のシンタックスハイライトに対応している言語一覧 (GitHub) | ねこの足跡R

コードブロックでシンタックスハイライト可能な言語一覧 (GitHub) | DevelopersIO

コードブロックの作成と強調表示 | GitHub Docs [公式]

Qiita でシンタックスハイライト可能な言語一覧 – Qiita

List of Supported Languages and Lexers – rouge-ruby/rouge Wiki – GitHub

languages.yml  – github/linguist – GitHub

ページ内リンクを張る

見出しにアンカーを追加する。

## 見出し <a id="midashi"></a>Code language: Markdown (markdown)

アンカーにジャンプするリンクを作成する。

[見出しへジャンプ](#midashi)Code language: Markdown (markdown)

参考:

Markdown でページ内リンクの書き方 | at backyard

Markdown でアンカーを入れるには | 寝坊した

Qiita Markdown のページ内リンクの罠 – Qiita

Github Markdown Heading Anchors – GitHub Gist

ローカルの画像を埋め込む

参考:

Markdown で画像を相対パスで指定する | 一歩ずつ学ぶ

How to display local image in markdown – Stack Overflow

動画を埋め込む

代替手段
  • アニメーション GIF として埋め込む。
  • サムネイル画像を表示して、動画へのリンクを張る。

対処法:

GIF 画像に動画へのリンクを張る。

[![世界ねこ散歩 サルデーニャ島編](thumbnail.gif)](https://www.youtube.com/watch?v=OqY9Frh3t3I)

参考:

YouTube の動画を Markdown 記法で Gist に埋め込んでみたよ | てっきんの具。

Qiita に YouTube を埋め込む – Qiita

Markdown で記事に Vimeo / TED 動画を埋め込む – Qiita

Markdown に YouTube の動画リンクを画像付きで埋め込む – GitHub Gist

Markdown 記法で動画を埋め込みたい – teratail

Insert video in README.md for an extension of VSCode – Stack Overflow

リスト

リストを入れ子にする場合は、内側のリストをインデントする。実装により使用可能なインデントは異なるが、スペース2個、3個、あるいは、4個、タブの何れかを使用することが多い。

VSCode のプレビューでは 3 個以上のスペースが必要である。ハードタブは「Markdown Lint」で警告が表示される。拡張機能「Markdown All in One」では既定でコンテキストに応じたインデント幅が使用されるが、設定で既定のタブ幅を使用することができる。

参考:

リストを入れ子にする | IT ガイド

Nested Lists – Tutorial | CommonMark

リストの入れ子のインデント数について – teratail

目次を作成する

参考:

Markdown でページ内リンク付きの目次を作成する方法 – Qiita

Markdown to create pages and table of contents? – Stack Overflow

図にキャプションを入れたい

  • 特に統一された専用の機能は存在しない。

参考:

図にキャプションを入れる場合 | IT Life

Zenn の画像にキャプションをつける | Hiroyuki Komatsu

GitHub

ドキュメント:

基本的な書き方とフォーマットの構文 | GitHub Docs [公式]

リポジトリ:

github/linguist: Language Savant – GitHub

コード:

vendor – github/linguist – GitHub

languages.yml – github/linguist – GitHub

Qiita

  • 基本的には「GFM」 (GitHub Flavored Markdown) に準拠しているが、一部拡張されている。

ドキュメント:

Markdown 記法 チートシート | Qiita [公式]

リンク:

Qiita でシンタックスハイライト可能な言語一覧 – Qiita

参考:

Qiita マークダウン記法 一覧表/チートシート – Qiita

ページ内リンク/注釈/折りたたみ等 – Qiita

CommonMark

公式サイト:

CommonMark [Official]

ドキュメント:

CommonMark Spec [Official]

参考:

CommonMark の仕様とか – Qiita

CommonMark の現状 2017年4月版 | Islands in the byte stream

GitHub Flavored Markdown

ドキュメント:

GitHub Flavored Markdown Spec [Official]

エディタ

参考:

おすすめエディタ | はしくれエンジニアもどきのメモ

VSCode で編集する

こちらのページを参照

参考:

VSCode で Markdown をプレビューするには? | @IT

リンク

Basic Syntax | Markdown Guide

Markdown Syntax Documentation | Daring Fireball

Basic Writing and Formatting Syntax | GitHub Docs [Official]

まとめ/チートシート

README.md ファイル/マークダウン記法まとめ | codechord

Markdown 記法 チートシート (mignonstyle) – GitHub Gist

Markdown 記法まとめ – 見出し/段落/改行/水平線/強調/引用/コード | はしくれエンジニアもどきのメモ

Markdown 記法まとめ – リスト/リンク/画像/インライン HTML/エスケープ | はしくれエンジニアもどきのメモ

Cheat Sheet | Markdown Guide

Markdown Cheatsheet · adam-p/markdown-here Wiki – GitHub

オンラインツール

YouTube のサムネイルを Markdown で埋め込むための文字列変換というページ | てっきんの具。

Markdown

公式サイト:

Markdown | Daring Fireball

HTML2MD

リポジトリ:

Kaned1as/html2md: HTML 2 Markdown Library Written in Rust – GitHub

記事をシェアする:
タグ:

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

Protected by reCAPTCHA