Qiitaの投稿や、GitHubのREADME.mdなど、何かと使用する機会があったのでMarkdown記法についてまとめました。
QiitaもGitHubも独自に拡張されていますが、まずは共通の記法を覚えたいと思います。
記法
※MarkdownからHTMLの生成はPreprosで行ったものを一目で理解しやすいよう整形しました。
段落
空行で区切ると、段落<p>になります。
test
test
↓
<p>test</p>
<p>test</p>
改行
行末に半角スペース2つを入れます。
test
test
↓
<p>test<br>test</p>
強調
斜体
「*」1つで囲みます。(「_」でも可)
*斜体*
↓
<p>
<em>斜体</em>
</p>
太字
「*」2つで囲みます。(「_」でも可)
**太字**
↓
<p>
<strong>太字</strong>
</p>
斜体+太字
「*」3つで囲みます。(「_」でも可)
***斜体+太字***
↓
<p>
<strong>
<em>斜体+太字</em>
</strong>
</p>
コード
バッククォートで囲みます。
`
*{
all:initial;
}
`
<p>
<code>
*{
all:initial;
}
</code>
</p>
リスト
順序無しリスト
-(ハイフン) を行頭に付けます。
- test1
- test2
- test3
↓
<ul>
<li>test1</li>
<li>test2</li>
<li>test3</li>
</ul>
順序ありリスト
数字. を行頭に付けます。
1. test1
2. test2
3. test3
↓
<ol>
<li>test1</li>
<li>test2</li>
<li>test3</li>
</ol>
見出し
行頭に#を付けます。
# test
## test
### test
#### test
##### test
###### test
↓
<h1>test</h1>
<h2>test</h2>
<h3>test</h3>
<h4>test</h4>
<h5>test</h5>
<h6>test</h6>
リンク
[タイトル](http://example.com)
↓
<p><a href="http://example.com">タイトル</a></p>
画像
↓
<p>
<img src="http://example.com/img/test.jpg" alt="代替テキスト" title="タイトル">
</p>
引用
通常の引用は行頭に>
二重引用は行頭に>>
>test
>>test
↓
<blockquote>
<p>test</p>
</blockquote>
<blockquote>
<blockquote>
<p>test</p>
</blockquote>
</blockquote>
空白
test
test
 test
 test
 test
↓
<p>test<br>
test<br>
 test<br>
 test<br>
 test</p>
整形
半角スペース4個もしくはタブを付けます。
test
↓
<pre>
<code>test</code>
</pre>
水平線
アンダースコア、アスタリスク、ハイフンなどを3つ以上連続して記述します。(記号の間にはスペースを入れる事が出来ます)
test
_ _ _
test
* * *
test
- - -
test
<p>test</p>
<hr>
<p>test </p>
<hr>
<p>test </p>
<hr>
<p>test</p>