はじめに
Qiitaで記事を書く時のMarkdownについて調べてみたので、基礎だけでもまとめてみました。
初めての方でもわかりやすく書いたつもりなのでよかったら参考にしてみて下さい。
1.見出し
文頭に「#」をつけると「見出し」にすることができます。
見出しはh1〜h6まで有り、「#」の個数で表すことができます。
○記述例
#見出し
##見出し
###見出し
####見出し
#####見出し
######見出し
○表示例
見出し
見出し
見出し
見出し
見出し
見出し
2.コード挿入
記事内にコードを挿入したいときはバッククォート「 ` 」を使います。
表示したいコードの始めと終わりにバッククォート3つずつで囲みましょう。
ちなみにバッククォート「 ` 」の出し方は「 Shift + @ 」です。
○記述例
```
＜form class= “contact-form”>
＜input type= “text” placeholder= “NAME”>
＜textarea name=“message” placeholder=“MESSAGE”>
＜input type=“submit” value=“SEND”>
＜/form>
```
○表示例
<form class= “contact-form”>
<input type= “text” placeholder= “NAME”>
<textarea name=“message” placeholder=“MESSAGE”>
<input type=“submit” value=“SEND”>
</form>
3.コードにシンタックスハイライト、ファイル名をつける
挿入したコードにはシンタックスハイライトを入れたり、ファイル名をつけることができます。
記入方法は「 ```言語名:ファイル名 」です。
例えばHTMLだと下記のようになります。
○記述例
```html:index.html
＜form class= “contact-form”>
＜input type= “text” placeholder= “NAME”>
＜textarea name=“message” placeholder=“MESSAGE”>
＜input type=“submit” value=“SEND”>
＜/form>
```
○表示例
<form class= “contact-form”>
<input type= “text” placeholder= “NAME”>
<textarea name=“message” placeholder=“MESSAGE”>
<input type=“submit” value=“SEND”>
</form>
シンタックスハイライトを使えるのは以下の言語です。
主要な言語はだいたい使えます。
Bash, C#(cs), C++(cpp), CSS, Diff, HTML, XML, Ini, Java, Javascript, PHP, Perl, Python, Ruby, SQL, 1C, AVR Assembler(avrasm), Apache, Axapta, CMake, DOS .bat(dos), Delphi, Django, Erlang, Erlang, REPL, Go, Haskell, Lisp, Lua, MEL, Nginx, Objective C(objectivec), Parser3, Python, profile, Scala, Smalltalk, TeX, VBScript, VHDL, Vala
4.コードの一部を表示する
ハイライト付きでコードを表示する方法は表示したいコードをバッククォートで囲みます。
○記述例
`rails db:migrate`
○表示例
rails db:migrate
5.文字を太字(強調)にする
文字を太字にするには太字にしたい箇所の始めと終わりを2個ずつのアスタリスク「 * 」もしくは2個ずつのアンダースコア「 _ 」で囲みます。
○記述例
**アスタリスクで囲む**
__アンダースコアで囲む__
○表示例
アスタリスクで囲む
アンダースコアで囲む
6.リンクを挿入する
リンクを挿入したいときは [リンクしたいテキスト](URL) と記入します。
○記述例
[Googleに移動します](https://www.google.com/?hl=ja)
○表示例
7.箇条書きリスト
箇条書きのリストは、文頭に「*」「+」「-」のいずれかの記号を入れると表示できます。
その際記号と文の間に半角スペースを一つ空けましょう。
また、リストの上下に間隔を空けないと正しく表示されない場合もあるので注意。
○記入例①
* HTMLの基本
+ CSSの基本
- rubyの基本
○表示例①
HTMLの基本
CSSの基本
rubyの基本
記述例②
* HTML
+ HTML_1
- HTML_1_1
- HTML_1_2
- HTML_2
- CSS
- ruby
表示例②
- HTML
- HTML_1
- HTML_1_1
- HTML_1_2
- HTML_2
- HTML_1
- CSS
- ruby
例②ようにリストをネスト(入れ子構造)させることもできます。
8.番号付きのリスト
番号付きのリストは、文頭に「数字 . 」をを入れると表示できます。
その際「数字 . 」と文の間に半角スペースを一つ空けましょう。
また、リストの上下に間隔を空けないと正しく表示されない場合もあるので注意。
○記述例
1. html
2. css
3. ruby
○表示例
html
css
ruby
9.テーブル(表)
テーブルは「 | 」 「 - 」 「 : 」を使って作成します。
ヘッダー下の2行目のコロン「 : 」でテーブル内の文字の配置を決定します。
|:---| → 左揃え
|:---:| → 中央揃え
|--:| → 右揃え
○記述例
|左揃え|中央揃え|右揃え|
|:---|:---:|--:|
|align-left|align-center|align-right|
|セルの左揃えです|セルの中央揃えです|セルの右揃えです|
または
|左揃え |中央揃え |右揃え |
|:------------|:------------:|------------:|
|align-left |align-center | align-right|
|セルの左揃えです|セルの中央揃えです|セルの右揃えです|
○表示例
| 左揃え | 中央揃え | 右揃え |
|---|---|---|
| align-left | align-center | align-right |
| セルの左揃えです | セルの中央揃えです | セルの右揃えです |
10.引用
引用を使う場合は「 > 」を記述します。
引用をネストする場合は「 > 」を複数回使えば可能です。
また、二重引用(ネスト)から引用に戻すためには、一回改行する必要があるみたいです。
○記述例
>引用文です。
>>ネスト１です。
>まだ引用です。
>引用文に戻りました
>>>ネスト２です
○表示例
引用文です。
ネスト１です。
まだ引用です。引用文に戻りました
ネスト２です
11.マークダウンの無効化
バックスラッシュ「 \ 」をMarkdownの前につけることでMarkdownを無効化出来ます。
「 \ 」は「option + ¥」で記述することができます。
記述例
\#見出し
○表示例
#見出し
↑
文頭に「 \ 」をつけると、このように「 # 」が適用されなくなります。