マークダウン記法

  • 見出し
    • 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

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

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

Markdown 記法 チートシート – GitHub Gist

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

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

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

Basic Syntax | Markdown Guide

Cheat Sheet | Markdown Guide

Markdown Syntax Documentation | Daring Fireball

Basic Writing and Formatting Syntax | GitHub Docs [Official]

画像を挿入する

![画像の説明](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

github/linguist/lib/linguist/languages.yml – 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)
Code language: Markdown (markdown)

参考:

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

多重リスト

参考:

Nested Lists – Tutorial | CommonMark

目次を作成する

参考:

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

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

GitHub

ドキュメント:

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

リポジトリ:

github/linguist: Language Savant. If your repository’s language is being reported incorrectly, send us a pull request! – GitHub

参考:

linguist/vendor – github/linguist – GitHub

linguist/languages.yml – github/linguist – GitHub

Qiita

参考:

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

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

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

Markdown 記法 チートシート | 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

まとめ

参考:

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