（追記）「強調」のところに誤りがありましたので訂正しました（2022/7/13、7/19）。
この記事は、はじめての「はてなブログMarkdown」（中級編）です。 Markdownを始めて勉強する方は、「入門編」から読み進めてください。
目次
中級編
「入門編」と「初級編」で、Markdownの見出し、段落、画像挿入、リンクを勉強してきました。 この「中級編」では、リスト（箇条書き）、引用、フェンス・コード・ブロック、インライン要素、エスケープを勉強します。 「中級編」まで読み通せば「はてなブログ」Markdownの基本はすべて押さえられたことになります。 より高度な内容は「上級編」で扱います。
リスト（箇条書き）
箇条書きのことをリストともいいます。 リストには、「順序なしリスト」と「順序付きリスト」があります。 「順序なしリスト」は、いわゆる箇条書きです。 各項目の前には「中黒」とよばれる記号（・）がつきます。 「順序付きリスト」も箇条書きですが、各項目の前に1,2,3などの数字がつきます。
順序無しリスト
順序なしリストは、項目が少ないときや項目の順序が重要でないときに使います。
リストはブロック要素なので、前のブロックとの間に空行を入れます。 各項目の行頭にマイナス記号（-）、半角空白を置き、その後に項目を書きます。 1つの項目を1行で書ききれなければ、改行して残りを書いても構いません。 次の項目も同様に、マイナス記号、半角空白、項目の内容と書いていきます。 以下、これの繰り返しです。 順序なしリストを書き終わったら、空行を入れます。
行頭にマイナスを付けると説明しましたが、実はマイナス以外に、プラス（+）あるいはアスタリスク（*）でも順序なしリストになります。 自分の好みで3つのうち好きなものを使ってください。
ツールバーでリストを作ることもできます。
- 箇条書きの項目を書いておく。項目1個につき1行で書く
- すべての項目を選択し、ツールバーの箇条書きボタン（見出しボタンの右側）をクリックする
- これで、各行の行頭にアスタリスクと半角空白がつき、Markdown書式のリストができあがる
このようにツールバーの場合はアスタリスクを使っています。 それでは、Markdownで書いた「順序なしリスト」とそのプレビューの画像を下に示しますので、比べてみてください。
順序付きリスト
順序付きリストは、行頭に数字（何桁でも良い）、次にピリオド、半角空白を書き、その後に項目の内容を続けます。 1つの項目が長いときは途中で改行しても構いません。
行頭の数字は、1、2、3・・・のように項目が増えるごとに数字も増やすのがわかりやすくて良いのですが、これを全部1にしたとしても、プレビューは、1、２、3、というように、順序のついたリストになります。 それでは、具体例を見てみましょう。
これを見て気がついたと思いますが、プレビューでは、01、02、03のように2桁で番号が振られます。 番号が二桁まで必要なほど項目が多ければ良いのですが、それより少ない場合も2桁表示で、あまり見栄えが良くありません。 これはスタイルシートで変更できるので、力のあるかたは、より良いスタイルにチャレンジしてみてください。
リストの特定の項目を指したいときは順序付きリストが良いです。 「箇条書き（順序付きリスト）の3を見てください」のような表現ができます。 そうでなければ、順序なしリストを使うほうが良いでしょう。
引用（ブロック・クォート）
少し長い文章を引用するときには、本文と区別するために「引用（ブロック・クォート）」を使います。 これはブロック要素なので、前のブロックと空行で区切ります。
引用では、各行の行頭に不等号の記号（>）、半角スペースをつけます。
引用では段落と同じように改行が半角空白に変換されて、次の行がつながります。
引用が長くて複数の段落からなるときは、段落の間を空行で区切ります。
引用が続く間は、行頭の>をつけてください。
それでは、具体例を示します。
プレビューでは、引用が薄い線の枠で囲まれた形になります。 これはPCの場合で、スマホの場合は左側に薄い縦のラインが引かれて、字下げされた形で表示されます。 また、引用中の段落も、この例から読み取れます。
フェンス・コード・ブロック
フェンス・コード・ブロックは、プログラムを表現したいときに使います。 プログラムでは改行やインデントをそのままに表示しなければなりません。 改行を半角空白にしたり、行を詰めたりすることは、プログラムそのものを壊しかねないからです。 フェンス・コード・ブロックは、ブロック内に書かれたものを、全く同じ形で投稿後も表示します。 また、Markdownの特別な意味を持つ文字（例えば見出しを意味する#など）はその意味を失います。
フェンス・コード・ブロックはブロック要素なので、前のブロックとの間に空行をはさみます。 フェンス・コード・ブロックの最初と最後の行は、バックティック（`）を3つ続けて書きます。 例を見てみましょう。
プレビューでは四角い枠の中にフェンス・コード・ブロックの中身がそのまま表示されています。
さて、プログラムは、予約語、変数、演算子、文字列など、それぞれの言語に応じた様々な要素を持っています。 これらはプログラムの文法（シンタックス）で決められています。 その要素を区別して見やすくするために、色付けすることが可能です。 これを「シンタックス・ハイライト」といいます。
シンタックス・ハイライトするには、開始行の3つのバックティックの直後にプログラム言語名を小文字で書きます。 小文字ということに注意してください。 C言語は大文字で書くのが習慣ですが、シンタックス・ハイライトではそれは小文字でなければなりません。 では、さきほどのプログラムをシンタックス・ハイライトしたものをご覧ください。
「はてなブログ」がシンタックス・ハイライトできる言語は数多くありますが、その一覧はヘルプに示されています。
ブロック、強調（インライン要素）
ブロック要素の中に含まれる各要素をインライン要素と言います。 ただし、フェンス・コード・ブロックの中身は例外です。
では、インライン要素にはどんなものがあるでしょうか？ 今までの学習で出てきたインライン要素は文字とリンクです。 ここでは新たに「コード」と「強調」というインライン要素を学びましょう。
「コード」はバックティックで囲まれた文字列です。 コードはその文字列通りに表示されます。 そして、コードの中ではMarkdownで特別の意味を持つ#などは意味を失い、その文字自体として表示されます。 では、具体例を見てみましょう。
Markdownの中で特別の意味を持つ(、)、{、}がブロックの中ではその文字自体として表示されます。 また、ブロックは薄いグレーの網掛けがついて表示されることもわかります。
インライン要素には「強調」もあります。 強調は2種類あり、エンファシス（emphasis）とストロング（strong）です。 それぞれHTMLの<em>タグと<strong>タグに対応します。
エンファシスは文字列をアスタリスク（*）またはアンダースコア（_）で囲みます。 ストロングは文字列を2個のアスタリスク、またはアンダースコアで囲みます。
多くのシステムでは、エンファシスが斜体（イタリック体）に、ストロングが太字（ボールド）になります。 ただし、これはスタイルシートの設定によってはそうならないこともあります。 例えば、「はてなブログ」のデザインを「Novel」に設定すると、エンファシスは斜体にならずノーマルの文字列として表示されます（2022/7/13確認）。 ストロングは太字になります。
※ 調べてみると、「Novel」ではスタイルシートの定義で<em>タグは斜体ではなくノーマル（通常の字体）として定義されていました。
これを変えるには、設定からスタイルシートの変更をする必要があります。
これは上級者の話題ですが、一応やり方を書いておきます。
「設定」から「詳細設定」を選び、「<head>要素にメタデータを追加」の入力枠に<style>em{font-style:italic;}</style>と書き、「変更する」ボタンをクリックします。
以上で、エンファシスが斜体になって表示されるようになります。
それでは、強調のMarkdownとプレビューをご覧ください。
編集画面
- これは*強調（エンファシス）*です。 - これは**強調（ストロング）**です。 - これは_強調（エンファシス）_です。 - これは__強調（ストロング）__です。
プレビュー
- これは強調（エンファシス）です。
- これは強調（ストロング）です。
- これは強調（エンファシス）です。
- これは強調（ストロング）です。
1行目はアスタリスクを、2行目はアンダースコアを使っています。
エスケープ
エスケープとは、Markdownで使われる特別な文字、例えば見出しの意味を与える#などを、その文字自体として表示するための仕組みをいいます。 具体的にはその文字の直前にバックスラッシュ（\）を置きます。 Markdownで\#と書くと、#がプレビューで現れます。
このようなエスケープの必要な文字は、
\ ` * _ { } ( ) [ ] # + - . !
の15文字です。
これとは別にHTMLタグを防ぐためのエスケープがありますが、それは上級編で扱います。 このことについて、現時点でみなさんが注意しなくてはいけないのは<と>で文字列を挟むとHTMLタグとみなされて、そのままの形では表示されないということです。 もし、このような表示が必要になったら、上級編のエスケープを見てください。
