Markdown記法レシピ 

### サンプル

> `title`
> 
>```
> 書き方サンプル 
>```
>→**結果(+補足)**
>×N個

## テキスト系

#### `見出し`
```
   # h1
   ## h2
   ### h3
   #### h4
   ##### h5
   ###### h6
```
#### `強調`
```
**text**
__テキスト__
```

**text**
__テキスト__
#### `イタリック`
```
*text*
_テキスト_
```
*text* 
_テキスト_

#### `強調＋イタリック`
```
***text***
___テキスト___
```
***text***
___テキスト___

#### `打消し線`
```
~~テキスト~~
```

~~テキスト~~

#### `折りたたみ`
```
<details><summary>要約</summary>
詳細が表示されます</details>
```

<details><summary>要約</summary>
詳細が表示されます</details>
**補足**
summaryタグで囲まれたところが要約として表示され、そこをクリックすると詳細が表示されます

#### `改行`
`半角スペース×2` or `<br>`

**補足**
 \<br>のあとに改行が必要

#### `引用`
```
>これはテストです
>>二重引用も可能です
>
>テスト終わりです
```
>これはテストです
>>二重引用も可能です
>
>テスト終わりです

#### `定義`
```
<dl>
	<dt>項目1</dt>
	<dd>定義1</dd>
        <dt>項目2</dt>
	<dd>定義2</dd>
</dl>
```
<dl>
	<dt>項目1</dt>
	<dd>定義1</dd>
        <dt>項目2</dt>
	<dd>定義2</dd>
</dl>

**補足**
`dl`の中には定義を複数書くことができる
`dt`には項目、`dd`にはその定義を書く
</dl>
#### `注釈`
```.md
注釈の書き方:    注釈[^任意のワード]
注釈先の書き方:  [^任意のワード]: 注釈はカーソルをホバーすると表示される。クリックすると文末に移動する。
```

注釈[^任意のワード]
[^任意のワード]: 注釈はカーソルをホバーすると表示される。クリックすると文末に移動する。
<br>


**補足**
任意のワードは共通であればホントになんでもいい
注釈はすぐ下に書かなくてもどこに書いても、対応する任意のワードの説明がページの一番下に表示される

#### `水平線`
```
 ***
hoge
 ------
 
 -- --
hoge
 * * *
 ```
 
 ***
hoge
 ------
 
 -- --
hoge
 * * *
**補足**
`* -`のどちらかを使用
記号は3つ以上入力する
間にスペースがあっても可

## リスト系

#### `箇条書きリスト`
```
- リスト１
+ リスト２
	* 入れ子リスト１
* リスト３
```
- リスト１
+ リスト２
	* 入れ子リスト１
* リスト３

**補足**
`- + *`のうちどれかを一文字使用
`- + *` + `半角スペース` + `テキスト`
階層化したい場合は記号の前にタブ挿入


#### `番号付きリスト`
```
1. リスト１
	1. 入れ子リスト１
	2. 入れ子リスト２
2. リスト２
3. リスト３
```
1. リスト１
	1. 入れ子リスト１
	2. 入れ子リスト２
2. リスト２
3. リスト３

**補足**
`数値`+`半角ドット`
半角ドットの後にはスペースを挿入
階層化したい場合はタブ挿入


#### `チェックボックス`
```
- [ ] チェックボックスのテスト
- [ ] ハイフン + 半角スペース + [半角スペース]
- [x] 間にxを入力するとチェックが入る
- [ ] チェックボックスのテスト終了
```
- [ ] チェックボックスのテスト
- [ ] `ハイフン` + `半角スペース` + `[半角スペース]`
- [x] 間にxを入力するとチェックが入る
- [ ] チェックボックスのテスト終了

## リンク系

#### `リンク`
```
https://www.google.com
or
<https://www.google.com>
```
https://www.google.com
<https://www.google.com>
<br>

#### `リンク()`
```
[Google](https://www.google.com)
```
[Google](https://www.google.com)

#### `リンク(遷移先の位置指定)`

```
[この項目の位置]
(https://qiita.com/KyongminS/items/962b281c5f8c34400b9a/#リンク遷移先の位置指定)
```

**[この項目の位置](https://qiita.com/KyongminS/items/962b281c5f8c34400b9a/#リンク遷移先の位置指定)**
遷移先の表示させたい箇所のid名を特定して、リンク先URLの末尾に`/#id名`の形式で追記する
![スクリーンショット 2019-10-29 19 59 42](https://user-images.githubusercontent.com/45557984/67761618-fedd7a00-fa86-11e9-819e-276fea795d47.png)


#### `ページ内リンク`
```
[見出し1](#見出し1)
```
[サンプル](#サンプル)

**補足**
見出しの数に関わらず#の数は１つ
その他細かいルールは以下を参考
[@aymikmtsさん「[Qiita Markdown記法]ページ内リンク・注釈・折りたたみ等」](https://qiita.com/aymikmts/items/71e550bf2c10f36883e9)

## 画像系

#### `画像挿入`

``` 
![画像ファイル名](http://placehold.it/100)
```
![画像ファイル名](http://placehold.it/100)
## コード系



#### `インライン`
```
`const test = "test"`
```

`const test = "test"`

#### `pre記法`

```

    ```html
        <div>ここにコードを記入</div>
    ```

    ~~~html
        <p>記号は`でも~でも可</p>
        <p>どちらかの３つでコードを囲む</p>
    ~~~

    ```js:hoge
        // 上の```の右に PGの種類:タイトル でプログラムの種類、ファイル名も表示できる
        const hoge = "ほげほげ"
    ```
```

以下表示結果

```html
<div>ここにコードを記入</div>
```

~~~html
<p>記号は`でも~でも可</p>
<p>どちらかの３つでコードを囲む</p>
~~~

```js:hoge
// 上の```の右に PGの種類:タイトル でプログラムの種類、ファイル名も表示できる
const hoge = "ほげほげ";
```

## グラフ系

#### `表`

```
|単語|意味|例|
|---|--:|:-:|
|春|すずしい|春はすずしい|
|夏|あつい|夏はあつい|
|秋|すずしい|秋はすずしい|
|冬|さむい|冬はさむい|
```

|単語|意味|例|
|---|--:|:-:|
|春|すずしい|春はすずしい|
|夏|あつい|夏はあつい|
|秋|すずしい|秋はすずしい|
|冬|さむい|冬はさむい|

**補足**
項目の始まる行の前に`|---|---|---|`を1行挟む必要がある
左寄せ   `---` or `:--`  右寄せ   `--:`  中央寄せ `:-:`

<br>
順次追加

```

```

```

```

### 参照
[てぃー びーさん 「Markdown記法 サンプル集」](https://qiita.com/tbpgr/items/989c6badefff69377da7)
[Qiita公式「Markdown記法 チートシート」](https://qiita.com/Qiita/items/c686397e4a0f4f11683d)
[oreoさん「Markdown記法一覧」](https://qiita.com/oreo/items/82183bfbaac69971917f)
[aymikmtsさん「[Qiita Markdown記法]ページ内リンク・注釈・折りたたみ等」](https://qiita.com/aymikmts/items/71e550bf2c10f36883e9)