Movatterモバイル変換


[0]ホーム

URL:


コンテンツにスキップ
Wikibooks
検索

Markdown

出典: フリー教科書『ウィキブックス(Wikibooks)』

Markdown は、軽量で簡単に学習できるマークアップ言語です。文章を記述する際にシンプルな記法を使用し、HTMLや他のフォーマットへの変換を容易にします。主にブログ、ドキュメント、READMEファイル、技術文書で使用されます。本ハンドブックでは、Markdownの基本記法から応用テクニックまで幅広く解説します。

特徴

[編集]

Markdownの主な特徴は次の通りです:

  • シンプルな記法:記号を使った直感的な書き方。
  • 可読性:HTMLのようなタグではなく、プレーンテキストとしても読める。
  • 多用途:ブログ、ドキュメント、電子書籍など幅広く使用可能。
  • 拡張性:Markdown拡張(e.g., GitHub Flavored Markdown)を利用すれば、表やチェックリストなどの高度な要素も記述可能。

対象読者

[編集]
  • ブログ記事や技術文書を執筆する人
  • 簡単に使えるマークアップ言語を探している人
  • READMEやドキュメントの作成を効率化したいエンジニア

目次

[編集]
  1. Markdownとは
  2. 基本記法
  3. 拡張記法
  4. ツールとエディタ
  5. 応用テクニック
  6. 演習問題
  7. 参考文献

Markdownとは

[編集]

Markdownは、2004年にJohn Gruberによって作られたマークアップ言語です。以下の目的で設計されました:

  • HTMLのように複雑な記述を不要にする。
  • 誰でも直感的に理解できる記法を提供する。
  • プレーンテキストとしても読みやすいフォーマットを作成する。

Markdownは多くのツールやプラットフォームで採用されており、簡単にHTMLやPDFに変換できます。

基本記法

[編集]

見出し

[編集]

# を使うことで見出しを作成できます。

# 見出し1## 見出し2### 見出し3
HTMLへの展開例
<h1class="code-line"data-line-start=0data-line-end=1><aid="1_0"></a>見出し1</h1><h2class="code-line"data-line-start=1data-line-end=2><aid="2_1"></a>見出し2</h2><h3class="code-line"data-line-start=2data-line-end=3><aid="3_2"></a>見出し3</h3>

強調

[編集]

文字を強調する方法は以下の通りです:

  • 太字**太字** または__太字__
  • 斜体*斜体* または_斜体_
これは**太字***斜体* の例です。
HTMLへの展開例
<pclass="has-line-data"data-line-start="0"data-line-end="1">これは<strong>太字</strong><em>斜体</em> の例です。</p>

リスト

[編集]
  • 箇条書きリストは- または* を使用します。
  • 番号付きリストは数字とピリオドを使用します。
-項目1-項目2-サブ項目1-サブ項目21. 手順A2. 手順B1. サブ手順α2. サブ手順β
HTMLへの展開例
<ul><liclass="has-line-data"data-line-start="0"data-line-end="1">項目1</li><liclass="has-line-data"data-line-start="1"data-line-end="5">項目2<ul><liclass="has-line-data"data-line-start="2"data-line-end="3">サブ項目1</li><liclass="has-line-data"data-line-start="3"data-line-end="5">サブ項目2</li></ul></li></ul><ol><liclass="has-line-data"data-line-start="5"data-line-end="6">手順A</li><liclass="has-line-data"data-line-start="6"data-line-end="9">手順B<ol><liclass="has-line-data"data-line-start="7"data-line-end="8">サブ手順α</li><liclass="has-line-data"data-line-start="8"data-line-end="9">サブ手順β</li></ol></li></ol>

リンクと画像

[編集]
  • リンク:[リンクテキスト](URL)
  • 画像:![代替テキスト](画像URL)
[Google](https://www.google.com)![サンプル画像](https://example.com/image.png)
HTMLへの展開例
<pclass="has-line-data"data-line-start="0"data-line-end="1"><ahref="https://www.google.com">Google</a></p><pclass="has-line-data"data-line-start="2"data-line-end="3"><imgsrc="https://example.com/image.png"alt="サンプル画像"></p>

コードブロック

[編集]

インラインコードはバッククォート` ` を使います。複数行のコードブロックは3つのバッククォートで囲みます。

文中に`インラインコード`を含めることが出来ます。複数行コードブロック```function hello() {   console.log("Hello, World!");}```
HTMLへの展開例
<pclass="has-line-data"data-line-start="0"data-line-end="1">文中に<code>インラインコード</code>を含めることが出来ます。</p><pclass="has-line-data"data-line-start="2"data-line-end="3">複数行コードブロック</p><pre><codeclass="has-line-data"data-line-start="4"data-line-end="8">function hello() {   console.log(&quot;Hello, World!&quot;);}</code></pre>

引用

[編集]

引用は> を使います。

>これは引用です。引用は段落を単位に行われるので、次の空行までが引用になります。
HTMLへの展開例
<blockquote><pclass="has-line-data"data-line-start="0"data-line-end="2">これは引用です。<br> 引用は段落を単位に行われるので、次の空行までが引用になります。</p></blockquote>

水平線

[編集]

水平線は--- または*** を使用します。

---
HTMLへの展開例
<hr>

拡張記法

[編集]

Markdownの基本記法に加えて、拡張記法を使うことでさらなる機能を利用できます。これには以下が含まれます:

[編集]
| 列1 | 列2 | 列3 ||-----|-----|-----|| 値1 | 値2 | 値3 || 値a | 値b | 値c |
HTMLへの展開例
<tableclass="table table-striped table-bordered"><thead><tr><th>列1</th><th>列2</th><th>列3</th></tr></thead><tbody><tr><td>値1</td><td>値2</td><td>値3</td></tr><tr><td>値a</td><td>値b</td><td>値c</td></tr></tbody></table>

チェックリスト

[編集]
- [x] 完了項目- [ ] 未完了項目
HTMLへの展開例
<ul><liclass="has-line-data"data-line-start="0"data-line-end="1"><inputtype="checkbox"id="checkbox0"checked="true"><labelfor="checkbox0">完了項目</label></li><liclass="has-line-data"data-line-start="1"data-line-end="2"><inputtype="checkbox"id="checkbox1"><labelfor="checkbox1">未完了項目</label></li></ul>

GitHub Flavored Markdown

[編集]

GitHubでは以下のような追加記法が使用可能です:

  • タスクリスト
  • ハイライトコードの言語指定(例: ```python

ツールとエディタ

[編集]

Markdownを編集する際に便利なツールやエディタを紹介します。

オンラインエディタ

[編集]

デスクトップアプリ

[編集]
  • Visual Studio Code(拡張機能でMarkdownプレビュー)
  • Typora

CLIツール

[編集]
  • Pandoc:MarkdownをHTMLやPDFに変換可能。
$pandocinput.md-ooutput.html

応用テクニック

[編集]

Markdownを活用した応用テクニックを紹介します。

MarkdownをHTMLに変換

[編集]

MarkdownをHTMLに変換してWebページを作成できます。

Markdown + CSS

[編集]

スタイルを適用して見栄えの良いドキュメントを作成。

演習問題

[編集]

問題1

[編集]

Markdownを使って以下の構造の文書を作成してください:

  1. 見出し1
  2. リスト(箇条書きと番号付き)
  3. コードブロック

問題2

[編集]

GitHub Flavored Markdownを使って、チェックリストとテーブルを含むMarkdown文書を作成してください。

参考文献

[編集]
"https://ja.wikibooks.org/w/index.php?title=Markdown&oldid=264925" より作成
カテゴリ:

[8]ページ先頭

©2009-2026 Movatter.jp