Markdown Extension Examples

このサイトはMarkdownによって構成されています
簡易的な使い方を以下に示しますが、このサイト独自のカスタマイズを含んでいます
あらかじめご了承ください

Custom Containers

Input

::: info
This is an info box.
:::

::: tip
This is a tip.
:::

::: warning
This is a warning.
:::

::: danger
This is a dangerous warning.
:::

::: details
This is a details block.
:::

Output

INFO

This is an info box.

TIP

This is a tip.

WARNING

This is a warning.

DANGER

This is a dangerous warning.

Details

This is a details block.

コード

Input

```python
print('Hello World')
```

`*3 によって囲む

先頭の `*3 の後に Langage を指定できる

Python を指定した例：

Output

print('Hello World')

チップ

Input

### Title <Badge type="info" text="default" />
### Title <Badge type="tip" text="^1.9.0" />
### Title <Badge type="warning" text="beta" />
### Title <Badge type="danger" text="caution" />

Output

Title default

Title ^1.9.0

Title beta

Title caution

リンク、フォント

Input

本文

# 見出し1
## 見出し2
### 見出し3
#### 見出し4
見出し4以下はどれも同じ

半角スペース2つで改行  
改行された

1行開けて段落

段落された

---
線を引いた

> 引用した
>> 多重引用できた

これは `code` です  
これは *イタリック* です  
これは **ボールド** です  


- リスト１
- リスト２

1. 番号リストA
1. 番号リストB
    1. 番号リストB-1 ←ここには空白スペース4つ
    1. 番号リストB-2
1. 番号リストC

テーブル
| 左揃え | 中央揃え | 右揃え |
| :-- | :--: | --: |
| 1 | 2 | 3 |

絵文字 :smile:  
:tada:
:100:

リンク
[uiro.dev](https://uiro.dev)

先頭に!を入れると画像として認識される
![建物](https://cdn.uiro.dev/test/landscape.webp)

htmlのタグを使ってサイズ調整
<img src="https://cdn.uiro.dev/test/landscape.webp" alt="代替テキスト" title="代替テキスト" width="200" height="200">

他のhtmlタグも使えます  
これは<span style="color: red; ">赤文字</span>です

Output

本文

見出し1

見出し2

見出し3

見出し4

見出し4以下はどれも同じ

半角スペース2つで改行
改行された

1行開けて段落

段落された

---

線を引いた

引用した

多重引用できた

これは code です
これは イタリック です
これは ボールド です

• リスト１
• リスト２

1. 番号リストA
2. 番号リストB
   1. 番号リストB-1 ←ここには空白スペース4つ
   2. 番号リストB-2
3. 番号リストC

テーブル

左揃え	中央揃え	右揃え
1	2	3

絵文字 😄
🎉 💯

リンク リンク

先頭に!を入れると画像として認識される

htmlのタグを使ってサイズ調整

他のhtmlタグも使えます
これは赤文字です

More

Check out the documentation for the full list of markdown extensions.