🐰 マークダウン記法まとめ
作成日: 2021/12/07
2

便利なUIやガイドもあるが、すぐ忘れるので記事に不自由しないためにメモ。
なるべくガイドにないものを調べたが、一部使えない表記もあった。
HTMLも使えるが、HTMLタグの中にMarkdownの記法は使えない。


見出し作成

# 見出しh1
## 見出しh2
  • 結果

見出しh1

見出しh2

文字色

<font color="Red">テキスト</font>
  • 結果
    テキスト

アンダーライン

<u>これはサンプル</u>のテキストです
  • 結果
    これはサンプルのテキストです

囲い文字

<span style="font-size:16pt; border: 1px red solid; padding: 4px;">Big</span>
  • 結果
    Big

〇乗などの上付き文字・下付き文字

X<sub>2</sub>
X<sup>2</sup>
  • 結果
    X2
    X2

リスト

* テキスト
    * テキスト
    * テキスト
  • 結果
  • テキスト
    • テキスト
    • テキスト
      「-」でも可。

番号付きリスト

1. テキスト
2. テキスト
    3. テキスト
  • 結果
  1. テキスト
  2. テキスト
    3. テキスト

折りたたみ

<details><summary>サンプルコード</summary><div>

\```rb
puts 'Hello, World'
\```
</div></details>
  • 結果
サンプルコード
```rb puts 'Hello, World' ```

空行・改行

1行目__(←半角スペース2つ)
2行目
<br>
<br>
3行目
  • 結果
    1行目__(←半角スペース2つ)
    2行目




    3行目

インライン表示

`テキストやコード`
例: `int i = 0`
  • 結果
    テキストやコード
    例: int i = 0

コードの挿入

	```言語:タイトル
	コード
	```
  • 結果
コード表記欄

リンクの挿入

[タイトル](URL)

引用

> テキスト
>> テキスト
  • 結果

テキスト

テキスト

画像の挿入

![代替テキスト](URL "タイトル")
  • 結果
    coffee.png

画像のサイズ指定

<img width="数値" alt="代替テキスト" src="URL">
  • 結果
    coffee

テーブルの挿入

| Head | Head | Head |
| ---- | ---- | ---- |
| Text | Text | Text |
| Text | Text | Text |
  • 補足
  • 左寄せ 「:--」
  • 右寄せ 「--:」
  • 中央寄せ 「:-:」
  • 結果(なお、Headerの上にマークダウン記述があるとテーブルがうまく表示されなかった)
Head Head Head
Text Text Text
Text Text Text

マークダウンのエスケープ

\マークダウン記号
  • 結果
    `インライン表示されなくなる`

youtubeなどの動画埋め込み

<iframe width="サイズ" height="サイズ" src="動画のURL" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  • 結果

スライドも埋め込みできるらしい

<iframe src="スライドのURLを記述" frameborder="0" width="サイズ指定" height="サイズ指定" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe>
  • 結果





参考記事:https://qiita.com/kamorits/items/6f342da395ad57468ae3