Markdownスタイルガイド
Astroでコンテンツを作成する際に使用できる基本的なMarkdown構文のサンプルをご紹介します。
見出し
以下のHTML要素 <h1>〜<h6> は、6段階の見出しレベルを表します。<h1> が最上位の見出しで、<h6> が最下位の見出しです。
H1
H2
H3
H4
H5
H6
段落
Xerum, quo qui aut unt expliquam qui dolut labo. Aque venitatiusda cum, voluptionse latur sitiae dolessi aut parist aut dollo enim qui voluptate ma dolestendit peritin re plis aut quas inctum laceat est volestemque commosa as cus endigna tectur, offic to cor sequas etum rerum idem sintibus eiur? Quianimin porecus evelectur, cum que nis nust voloribus ratem aut omnimi, sitatur? Quiatem. Nam, omnis sum am facea corem alique molestrunt et eos evelece arcillit ut aut eos eos nus, sin conecerem erum fuga. Ri oditatquam, ad quibus unda veliamenimin cusam et facea ipsamus es exerum sitate dolores editium rerore eost, temped molorro ratiae volorro te reribus dolorer sperchicium faceata tiustia prat.
Itatur? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sapicia is sinveli squiatum, core et que aut hariosam ex eat.
画像
構文
出力例
引用
引用要素は、他のソースから引用されたコンテンツを表します。オプションで、footerまたはcite要素内に引用元を含めることができ、また注釈や略語などのインライン変更を含めることもできます。
出典なしの引用
構文
> Tiam, ad mint andaepu dandae nostion secatur sequo quae.
> **注意** 引用文の中でも _Markdown構文_ が使えます。出力例
Tiam, ad mint andaepu dandae nostion secatur sequo quae.
注意 引用文の中でも Markdown構文 が使えます。
出典付きの引用
構文
> メモリを共有することでコミュニケーションするのではなく、コミュニケーションすることでメモリを共有しましょう。<br>
> — <cite>Rob Pike[^1]</cite>出力例
メモリを共有することでコミュニケーションするのではなく、コミュニケーションすることでメモリを共有しましょう。
— Rob Pike1
表
構文
| イタリック | 太字 | コード |
| ---------- | -------- | ------ |
| _斜体_ | **太字** | `コード` |出力例
| イタリック | 太字 | コード |
|---|---|---|
| 斜体 | 太字 | コード |
コードブロック
構文
新しい行に3つのバッククォート（```）を使用し、その後にコードを書き、再び3つのバッククォートで閉じます。言語固有の構文をハイライトするには、最初の3つのバッククォートの後に言語名（html、javascript、css、markdown、typescript、txtなど）を1単語で書きます。
```html
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8" />
<title>HTML5文書の例</title>
</head>
<body>
<p>テスト</p>
</body>
</html>
```出力例
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8" />
<title>HTML5文書の例</title>
</head>
<body>
<p>テスト</p>
</body>
</html>リストの種類
順序付きリスト
構文
1. 最初の項目
2. 2番目の項目
3. 3番目の項目出力例
- 最初の項目
- 2番目の項目
- 3番目の項目
順序なしリスト
構文
- リスト項目
- 別の項目
- さらに別の項目出力例
- リスト項目
- 別の項目
- さらに別の項目
ネストされたリスト
構文
- 果物
- りんご
- オレンジ
- バナナ
- 乳製品
- 牛乳
- チーズ出力例
- 果物
- りんご
- オレンジ
- バナナ
- 乳製品
- 牛乳
- チーズ
その他の要素 — 略語、下付き文字、上付き文字、キーボード、マーク
構文
<abbr title="Graphics Interchange Format">GIF</abbr> はビットマップ画像形式です。
H<sub>2</sub>O
X<sup>n</sup> + Y<sup>n</sup> = Z<sup>n</sup>
<kbd>CTRL</kbd> + <kbd>ALT</kbd> + <kbd>Delete</kbd> を押してセッションを終了します。
ほとんどの<mark>サンショウウオ</mark>は夜行性で、昆虫や虫、その他の小さな生き物を狩ります。出力例
GIF はビットマップ画像形式です。
H2O
Xn + Yn = Zn
CTRL + ALT + Delete を押してセッションを終了します。
ほとんどのサンショウウオは夜行性で、昆虫や虫、その他の小さな生き物を狩ります。