マークダウン記法完全ガイド
マークダウンのすべての記法を網羅したサンプル記事です。見出し、リスト、コードブロック、テーブル、引用など、すべての記法を確認できます。
この記事では、マークダウンのすべての記法を網羅的に紹介します。各セクションで異なる記法を確認できます。
H3見出し
H4見出し
H5見出し
H6見出し
通常のテキストです。
太字(Bold) のテキストです。
斜体(Italic) のテキストです。
太字と斜体(Bold Italic) のテキストです。
取り消し線(Strikethrough) のテキストです。
インラインコードは const example = "hello" のように記述します。
複数行のコードブロック(JavaScript):
function greet(name) { console.log(`Hello, ${name}!`); return `Welcome, ${name}`;}
const message = greet('World');console.log(message);複数行のコードブロック(Python):
def fibonacci(n): if n <= 1: return n return fibonacci(n-1) + fibonacci(n-2)
for i in range(10): print(f"F({i}) = {fibonacci(i)}")複数行のコードブロック(TypeScript):
interface User { id: number; name: string; email: string;}
const users: User[] = [ { id: 1, name: 'Alice', email: 'alice@example.com' }, { id: 2, name: 'Bob', email: 'bob@example.com' }];
function findUser(id: number): User | undefined { return users.find(user => user.id === id);}言語指定なしのコードブロック:
これは言語指定のないコードブロックです。シンタックスハイライトは適用されません。順序なしリスト
- 項目1
- 項目2
- 項目3
- ネストされた項目1
- ネストされた項目2
- さらにネストされた項目
- 項目4
順序付きリスト
- 最初の項目
- 2番目の項目
- 3番目の項目
- ネストされた順序付き項目1
- ネストされた順序付き項目2
- 4番目の項目
混合リスト
- 順序付き項目1
- ネストされた順序なし項目
- 別のネストされた項目
- 順序付き項目2
- さらにネスト
- 深いネスト
- さらにネスト
チェックボックスリスト
- 完了したタスク
- 別の完了したタスク
- 未完了のタスク
- もう一つの未完了タスク
参照形式の画像:
これは引用ブロックです。 複数行にわたる引用も可能です。
空行を挟むこともできます。
ネストされた引用も可能です。
上記が水平線です。以下のようにも記述できます:
基本的なテーブル
| 列1 | 列2 | 列3 |
|---|---|---|
| データ1 | データ2 | データ3 |
| データ4 | データ5 | データ6 |
配置指定付きテーブル
| 左揃え | 中央揃え | 右揃え |
|---|---|---|
| 左 | 中央 | 右 |
| テキスト | テキスト | テキスト |
| 長いテキストの例 | 中央揃えのテキスト | 右揃えのテキスト |
複雑なテーブル
| 機能 | 説明 | 対応状況 |
|---|---|---|
| マークダウン | 基本的な記法 | ✅ 対応 |
| コードブロック | シンタックスハイライト | ✅ 対応 |
| テーブル | 複雑なレイアウト | ✅ 対応 |
| 数式 | LaTeX記法 | ⚠️ 一部対応 |
特殊文字をエスケープするには、バックスラッシュを使用します:
*これはアスタリスクです*
# これはハッシュ記号です
[これは角括弧です]
マークダウン内でHTMLタグも使用できます:
Ctrl + C でコピーできます。
ハイライトされたテキスト
小さなテキスト
下付き文字 と 上付き文字
これは段落です。同じ段落内では改行は無視されます。
これは別の段落です。空行を挟むことで新しい段落になります。
この行の末尾に2つのスペースを入れると、
強制的に改行されます。
タスクリスト(GitHub風)
- 完了したタスク1
- 完了したタスク2
- 未完了のタスク1
- 未完了のタスク2
定義リスト(一部のマークダウン実装で対応)
用語1 : 用語1の定義
用語2 : 用語2の定義 : 用語2の別の定義
JSON
{ "name": "サンプル", "version": "1.0.0", "dependencies": { "react": "^18.0.0", "typescript": "^5.0.0" }}CSS
.container { max-width: 1200px; margin: 0 auto; padding: 20px;}
.button { background-color: #007bff; color: white; padding: 10px 20px; border-radius: 5px; cursor: pointer;}
.button:hover { background-color: #0056b3;}HTML
<!DOCTYPE html><html lang="ja"><head> <meta charset="UTF-8"> <title>サンプルページ</title></head><body> <h1>Hello, World!</h1> <p>これはサンプルのHTMLです。</p></body></html>Bash/Shell
#!/bin/bashecho "Hello, World!"
# 変数の使用NAME="Astro Blog"echo "Welcome to $NAME"
# ループfor i in {1..5}; do echo "Iteration $i"doneYAML
name: markdown-syntax-showcaseversion: 1.0.0description: マークダウン記法の完全ガイド
features: - 見出し - リスト - コードブロック - テーブル
author: name: Tech Blog 編集部 email: editor@example.comこの記事では、マークダウンの主要な記法をすべて紹介しました:
- 見出し - H1からH6まで
- テキスト強調 - 太字、斜体、取り消し線
- リスト - 順序付き、順序なし、チェックボックス
- リンクと画像 - 通常形式、参照形式
- コード - インラインコード、コードブロック
- 引用 - 単一レベル、ネスト
- テーブル - 基本的なテーブル、配置指定
- その他 - 水平線、HTMLタグ、エスケープ
これらの記法がすべて正しく表示されることを確認してください。