Markdownの打ち消し線・下線・文字色の書き方
「打ち消し線はどう書く?」「文字を赤くしたいのにできない」— Markdown(マークダウン)の文字装飾は、標準でできるもの・HTMLの力を借りるもの・環境的に不可能なものの3層に分かれます。この整理を知らないと「書いたのに反映されない」で延々ハマります。このページで全部整理しました。表示は無料のMarkdownビューアーで確認できます。
| 装飾 | 書き方 | 使える場所 |
|---|---|---|
| 太字 | **テキスト** | ほぼすべて(標準記法) |
| 斜体 | *テキスト* | ほぼすべて(標準記法) |
| 打ち消し線 | ~~テキスト~~ | GFM対応サービス(GitHub・Qiita・Zenn等) |
| 下線 | <u>テキスト</u> | HTMLタグ可のサービス |
| 文字色 | <span style="color:red"> | style属性可の環境のみ(かなり限られる) |
| 文字サイズ | 見出し記法 or CSS | 記法としては存在しない |
打ち消し線(~~)の書き方
チルダ2つ(~~)で挟むと打ち消し線になります。訂正の履歴を残す、旧情報を見せ消しにする、といった用途で使います。
価格は ~~1,200円~~ **980円** になりました。
価格は 1,200円 980円 になりました。
~1つ で挟む独自仕様)。チルダの入力は、JIS配列では Shift+へ(^のキー)です。下線(アンダーライン)の書き方
下線はMarkdown標準記法に存在しません。HTMLタグが使える環境であれば、次のように書きます。
ここに <u>下線</u> を引きます。
ここに 下線 を引きます。
ただしWebの文章では、下線=リンクという強い慣習があります。下線付きなのにクリックできないテキストは読者を混乱させるため、強調目的なら太字(**)の方が適切です。下線は「書式として下線が要求される場面」(校正指示の再現など)に限定するのがおすすめです。
文字色の変え方と「使えない環境」の現実
文字色もMarkdown標準記法にはありません。HTMLの style 属性が使える環境でのみ、次の書き方ができます。
<span style="color: #e11d48;">赤字の注意書き</span>
赤字の注意書き
重要なのは、主要サービスの多くでこれが使えないことです。
| サービス | 文字色の変更 | 理由・備考 |
|---|---|---|
| GitHub | 不可 | セキュリティのためstyle属性を除去 |
| Qiita / Zenn | 不可 | 同上(サニタイズされる) |
| Notion | 記法では不可 | UIの文字色メニューで変更(Markdownではない) |
| はてなブログ・WordPress | 可 | HTML編集でstyle属性が書ける |
| 自サイト・変換ツール | 可 | CSS/HTMLを自分で制御できる |
文字サイズを変えたいとき
文字サイズの記法も存在しません。考え方は2通りです。
- 構造で表す — 大きくしたい理由が「重要な区切りだから」なら、それは見出し(
##)の仕事です - CSSで表す — ブログや自サイトなら、見出しや本文のサイズをCSSで一括調整します
Markdown Viewerでは、H1〜H3・本文それぞれの文字サイズをスライダーで調整して、結果をCSSとしてコピーできます。「本文だけ少し大きくしたい」といったブログの読みやすさ調整に便利です。
装飾が使えない環境での代替テクニック
GitHubのREADMEなど「太字・斜体・打ち消し線しか使えない」環境で目立たせたいときの、実用的な代替手段です。
| やりたかったこと | 代替手段 | 例 |
|---|---|---|
| 赤字で警告 | 絵文字+太字 | ⚠️ **注意**:この操作は取り消せません |
| 色付きの補足ボックス | GitHubのアラート記法 | > [!WARNING](引用の記事参照) |
| マーカー(蛍光ペン) | インラインコード | `重要な語句` は背景色付きで表示される |
| 大きな文字 | 見出し記法 | ## セクション名 |
| バッジ風の装飾 | shields.io等のバッジ画像 | READMEの定番手法 |
どの装飾がどう表示されるか、試しませんか?
貼り付けるだけで即プレビュー。文字色やサイズはスタイル調整パネルからCSSとして出力できます。
よくある質問
~~を書いたのに打ち消し線にならず、そのまま表示されます
チルダが全角(~)になっているか、表示先がGFM非対応かのどちらかです。半角チルダ2つ(~~)で挟んでいるか確認し、それでもだめなら <del> タグ(<s> でも可)を試してください。
太字と下線を同時に使えますか?
使えます。<u>**重要**</u> のようにHTMLタグとMarkdown記法は入れ子にできます(HTMLタグ内でMarkdownが効かないパーサーもあるため、その場合は <u><strong>重要</strong></u> と全部HTMLで書きます)。
ChatGPTの回答に~~が出てきました。これは何ですか?
打ち消し線の記法です。AIの回答はMarkdown形式なので、ビューアーに貼れば意図どおりの見た目(打ち消し線付き)で確認できます。
蛍光マーカーの「==テキスト==」という記法を見かけました
Obsidianなど一部ツールの拡張記法(ハイライト)です。標準記法ではないため、GitHub等では機能しません。互換性が必要な文書では使わない方が安全です。
関連ガイド
- Markdown記法一覧【チートシート】 — 太字・斜体などの基本装飾
- 引用(>)の書き方 — アラート記法もこちら
- コードブロック・インラインコードの書き方
- Markdown→HTML変換の方法まとめ