Markdown記法まとめ
前回はてなブログの編集方法検討について書きました。
それではMarkdown記法は実際にどのような書き方、表現ができるのか。
自分の学習メモを兼ねて紹介して行きたいと思います。
ただし、私が普段使うだろうなと思うものに偏っていますので悪しからず。
目次
目次の作成
調べ物をしているとしっかり目次を作っているブログが多く目に止まります。
初めは「いちいち面倒なことしてて偉いな」ぐらいにしか思っていませんでしたが、
はてなブログでは「見出し」と「目次生成のための一行」を記載するだけで
何も考えずに勝手に目次ができあがります。
私のような怠け者には大変助かる機能です。
*1
見出しについては後述しますが、基本的に以下の文を一行入れておくだけです。
[:contents]
これだけです！簡単!
見出し
見出しです。
目次より重要なのではないかと思います。
私が使うのは主に#のみです。（今の所は）
#見出し ##見出し ###見出し ####見出し #####見出し
太字
私は太字が好きなので強調する時には太字を使いたいです。
字が太くなるとなんとなくその文字が強くなったようなイメージがあって
割と好んで使っています。
さて、太字はどのように記述するのか。
**太字**
簡単ですね。どんどんいきましょう。
色付き文字
色付きも好きです。太字と合わせて利用することが多いです。
…なんと！Markdown形式だと色付き文字を表示することはできないんですね。
がーーん。
おとなしく
HTML形式
で使いましょう。がっかり。
<span style="color: #ff0000">赤字</span>
ってことは、太字と色付きはどうなるの？
MarkdownとHTMLを組み合わせて、だとできなそうなので、
残念だけどHTML形式で統一した書き方にするしかなさそうです。
<b><span style="color: red">赤字</span></b>
カラーコードなんて覚える気がないので、カラーネームで十分です。
#ff0000→redに書き換わってますね。
赤い太字にしたかったので、<b></b>タグを利用しました。
箇条書き
目次があれば必要ないかな、と思いましたが、
やはり普段手書きでも箇条書きをするので、まとめておきたいと思います。
・（てん）を使った箇条書き
* 箇条書き一行目
* ネスト
* ネスト
* ネスト
* 箇条書き二行目
* 箇条書き三行目
注意すべきは、*と箇条書き一行目の間に半角スペースを入れることです。
また、箇条書きの前後は一行開けておく必要があります。
当たり前ですが前の文章の続きと判断されるのを防ぐためです。
箇条書きをネストする際は、行の最初にスペースを2つ入れます。
以下のように表現されます。
- 箇条書き一行目
- ネスト
- ネスト
- ネスト
- ネスト
- ネスト
- 箇条書き二行目
- 箇条書き三行目
数字を使った箇条書き
1. いちばん
1. ネスト
1. ネスト
1. ネスト
1. にばん
1. さんばん
注意点ですが、数字の場合は勝手にナンバリングしてくれるので、
1.だけ書いておけば連番になります。
・（てん）を使う箇条書きと違って、ネストの際は初めに4つのスペース（もしくはタブ）を入れて利用します。
ただしネストの連番は1.1.のようになってはくれないので、
数字の箇条書きであればネストしない方が見やすいかもしれません。
上記の表記例は以下のように表現されます。
- いちばん
- ネスト
- ネスト
- ネスト
- にばん
- さんばん
箇条書きについては以上です。
コード（Syntax Highlight）の挿入方法
ブログをやっている方の中には、
プログラマーの方もしくはIT関係の方が多くいらっしゃいます。
そこでコードをブログに表示するために、シンタックスハイライト
という方法でコードの背景に色をつけて表現している例が多いです。
今後（もしかしたら）コードをブログに貼っつける機会があるかもしれないので、
やり方だけはメモしておこうと思います。
実はこのブログ内で既に使っていますが、
以下のような方法です。
と綺麗に説明したかったのですが、
ダブルクォート`で囲んでいるブロックをさらにダブルクォートで囲む術がなく
断念…。
文章で説明しますと、ダブルクォート3つで囲めばいいわけです。
表示例は上記に記載しているように四角で囲まれます。*2
```
コード
```
すごくお粗末だけどこんな感じです。
（どなたか表示方法をご存知でしたら教えていただけると助かります。）
URL
参照しているサイトなど、リンクになっていると嬉しいですよね。
はてなブログの機能としてもありますが記載しておきます。
私個人的には、サイトのタイトルさえわかればURLが表示されている必要はないので
タイトルがリンクになってさえいれば良いです。
書き方は以下の通りです。
[https://www.google.com:title] [http://liang-van-pelt.hatenablog.com/:title]
こんな感じで簡単ですね。
脚注
専門用語はわかりにくい言葉や説明が必要な表現のため
本文の最後に脚注をつけることができます。
はてなブログ機能としても「脚注」*3というのがありますね。
これが脚注((機能がもう既に用意されているので覚える必要はないとは思いますが...))です。
表形式
最後に、表を作りたい場合はどうすればいいのでしょうか。
以下のような書き方です。
文字を枠内の右に寄せるか、左に寄せるか、を表のヘッダ部で指定しています。
|左寄せ|右寄せ|中央寄せ| |:-----------|------------:|:------------:| |(0,0)|(0,1)|(0,2)| |(1,0)|(1,1)|(1,2)| |(2,0)|(2,1)|(2,2)| |(3,0)|(3,1)|(3,2)|
ちょっと見づらいですが、上記の2行目の各列で寄せの方向を決めています。
`: がある方向へ文字が移動されていることがわかると思います。
以下のように表示されます。
| 左寄せ | 右寄せ | 中央寄せ |
|---|---|---|
| (0,0) | (0,1) | (0,2) |
| (1,0) | (1,1) | (1,2) |
| (2,0) | (2,1) | (2,2) |
| (3,0) | (3,1) | (3,2) |
その他
その他として、以下の内容を考えていましたが、
直近で利用する機会がなさそうなので割愛します。
- 下線
- 斜字
- コメントアウト
- 取り消し線
まとめ
以上でmarkdown形式の表現方法について説明しました。
既に機能として与えられてはいるもののあえて説明をしたのは、
冒頭にもある通り別の業務での利用ができるからです。
githubでのmarkdown形式にも使えるので、
改めてまとめておいてよかったなという感想です。
今日はここまで。
