このサイトの Markdown + α 記法
はじめに
- このサイトは、静的サイトジェネレータ Hugo で作っています
- どんな記法だったかよく忘れるので、このサイトで使っている Markdown 記法をメモ
基本的な Markdown 記法
見出し
見出し1
はノートのタイトルに使っているので、本文中では見出し2
から始めます
# 見出し1
## 見出し2
### 見出し3
#### 見出し4
文字修飾
- 通常は
*
で囲むと斜体だけど、視認性がいまいちなので、ハイライト で修飾します
ちょっと*強調*してみよう。もう少し**強調**してみる。もっと***強調***もできるよ。
ちょっと強調してみよう。もう少し強調してみる。もっと強調もできるよ。
リンク
[アンカーテキスト](リンクのURL)
リスト
通常のリスト
- Hello!
- Hola!
- Bonjour!
* Hi!
- Hello!
- Hola!
- Bonjour!
- Hi!
番号付きリスト
1. First
2. Second
1. First
2. Second
- First
- Second
- First
- Second
タスクリスト
- [x] Task A
- [ ] Task B
- [ ] Task C
- Task A
- Task B
- Task C
画像
![](https://画像のURL)
横幅を指定する
[w**]
内で、画像のmax-width
をパーセント単位で指定できますw50
,w60
,w70
,w80
,w90
![w50](https://画像のURL)
Mobile 環境ではこの設定を無視します
影をつける
![shadow](https://画像のURL)
フォトフレームっぽく
![photo](https://画像のURL)
キャプションをつける
![](https://画像のURL 'キャプション')
キャプションにリンクを含める
![](https://画像のURL 'source: <a href="https://example.com">example.com</a>')
テーブル
| Head | Head | Head |
| ---- | ---- | ---- |
| Text | Text | Text |
| Text | Text | Text |
Head | Head | Head |
---|---|---|
Text | Text | Text |
Text | Text | Text |
横幅を指定する
{.w**}
で、画像のmin-width
をパーセント単位で指定できますw50
,w60
,w70
,w80
,w90
,w100
| Head | Head | Head |
| ---- | ---- | ---- |
| Text | Text | Text |
| Text | Text | Text |
{.w80}
Head | Head | Head |
---|---|---|
Text | Text | Text |
Text | Text | Text |
Mobile 環境ではこの設定を無視して、横幅いっぱいに表示します
引用
> 引用文1
> 引用文2
引用文1 引用文2
改行する
- 引用ブロック内では別行にしても改行されませんが、文章のあとに空白を2つ入れると改行されます
> 引用文1␣␣
> 引用文2
引用文1
引用文2
コードブロック
```js
const great = () => {
console.log("Awesome");
};
```
const great = () => {
console.log("Awesome");
};
- コードブロックをクリックすると、コードをクリップボードにコピーします
ファイル名を表示する
```js {name="fooBar.js"}
const great = () => {
console.log("Awesome");
};
```
fooBar.js
const great = () => {
console.log("Awesome");
};
コマンド
```sh
ls
```
ls
- コマンドは
sh
、スクリプトファイルはbash
やzsh
で指定
ターミナル風
```term
Hello, World!
```
Hello, World!
区切り線
---
数式
- デフォルトでは KaTeX を無効にしているので、数式を書くときにはフロントマターで
KaTeX
オプションをtrue
にします
別行で表示
$$
e^{i\theta} = \cos\theta + i\sin\theta
$$
$$ e^{i\theta} = \cos\theta + i\sin\theta $$
インラインで表示
たとえば、$E = mc^2$ のような感じでインライン表示できます。
たとえば、$E = mc^2$ のような感じでインライン表示できます。
このサイト独自の記法
メッセージ
note
これは note です
{.note}
これは note です
warning
これは warning です
{.warn}
これは warning です
ブロックを修飾する
影
ここのブロックに影をつけます
{.shadow}
ここのブロックに影をつけます
枠
ここのブロックに枠をつけます
{.border}
ここのブロックに枠をつけます
中央寄せ
ここのブロックを中央寄せします
{.center}
ここのブロックを中央寄せします
組み合わせ
ここのブロックに枠をつけて中央寄せします
{.shadow .border .center}
ここのブロックに枠をつけて中央寄せします
アコーディオン
{{< details "タイトル" >}}
表示したい内容
{{< /details >}}
表示したい内容
クイズ
選択型
{{< quiz >}}
この問題の正解はどれでしょうか?
- [x] answer 1
- [ ] answer 2
- [x] answer 3
{{< /quiz >}}
この問題の正解はどれでしょうか?
- answer 1
- answer 2
- answer 3
穴埋型
{{< quiz >}}
この問題の答えは何でしょうか?
- この問題の答えは*answer1*です。
- この問題の答えは*answer2*です。
- この問題の答えは*answer3*です。
{{< /quiz >}}
この問題の答えは何でしょうか?
- この問題の答えはanswer1です。
- この問題の答えはanswer2です。
- この問題の答えはanswer3です。
コンピュータ化学!
化学構造
```smiles {name="caffeine"}
CN1C=NC2=C1C(=O)N(C(=O)N2C)C
```
立体構造
```3dmol
6
C 0.6586599 0.0000000 0.0000000
C -0.6586599 0.0000000 0.0000000
H -1.2255934 -0.9144085 0.0000000
H -1.2255934 0.9144085 0.0000000
H 1.2255934 0.9144085 0.0000000
H 1.2255934 -0.9144085 0.0000000
```
ファイル名を表示したり、サイズを変えたり
```3dmol {name="ethylene.xyz", size="250px"}
6
C 0.6586599 0.0000000 0.0000000
C -0.6586599 0.0000000 0.0000000
H -1.2255934 -0.9144085 0.0000000
H -1.2255934 0.9144085 0.0000000
H 1.2255934 0.9144085 0.0000000
H 1.2255934 -0.9144085 0.0000000
```
アニメーション
```3dmol
6
C 0.0051800000 0.0000000000 0.0011200000
C -1.3151200000 0.0000100000 0.0008900000
H -1.8839800000 -0.9165800000 0.0008200000
H -1.8839800000 0.9165900000 0.0007900000
H 0.5739400000 0.9166500000 0.0012300000
H 0.5739500000 -0.9166800000 0.0011600000
6
C 0.1069247886 0.0010471256 -0.0151659909
C -1.4163011623 -0.0002422812 0.0087023126
H -1.9487916403 -0.9294334570 0.0335358554
(省略)
```
タンパク質
{{< molview file="/path/to/protein.pdb" >}}