マークダウン記法
この記事では、Lantanaで使用できるマークダウン記法の一覧を示します
普通のテキスト
そのまま記述可能です。
結果Lantanaは、シンプルで軽量なMKDocsのテーマです。 HTMLの知識がなくても簡単にサイトを作成できます。
改行するには、一行空行を挟みます。
エスケープ
マークダウンで意味のある文字(たとえば、*や#など)をテキストとして表示するには、エスケープが必要です。
結果
*#!`\
明示的な空行
二行以上にわたって改行したい場合など、一部の場合ではHTMLの<br/>
タグを使用します。
コメント
記事にコメントを記述する方法はHTMLと同じです。ビルド時に削除されます。
見出し
Hタグを生成します。記事にタイトルが指定されていない場合、自動的に記事の一番最初の見出しがタイトルになります。
また、見出しは目次にも表示されます。
結果これはH1タグになります
これはH2タグになります
これはH6タグになります
テキストの装飾
文章を様々に装飾する方法をまとめて紹介します。
_ か * で囲むとHTMLのemタグになり、 *このように* 表示されます。
__ か ** で囲むとHTMLのstrongタグになり、**このように** 表示されます。
それらを組み合わせることもできます。*** で囲むと、***このように*** 表示されます。
~~ で囲むと打消し線になり、 ~~このように~~ 表示されます。
^^ で囲むと下線がつき、^^このように^^ 表示されます。
== で囲むとハイライトがつき、==このように== 表示されます。
~ で囲むと下付き文字になり、使用すると~このように~表示されます。
^ で囲むと上付き文字になり、使用すると^このように^表示されます。
++ で囲むと++ctrl+alt+del++のようにキーボードのキーを表現できます。
また、`print("Hello,World!");`と記述することでコードをインライン表示できます。
__ か ** で囲むとHTMLのstrongタグになり、このように 表示されます。
それらを組み合わせることもできます。*** で囲むと、このように 表示されます。
~~ で囲むと打消し線になり、 このように 表示されます。
^^ で囲むと下線がつき、このように 表示されます。
== で囲むとハイライトがつき、このように 表示されます。
~ で囲むと下付き文字になり、使用するとこのように表示されます。
^ で囲むと上付き文字になり、使用するとこのように表示されます。
++ で囲むとCtrl+Alt+Delのようにキーボードのキーを表現できます。
また、print("Hello,World!");
と記述することでコードをインライン表示できます。
脚注
対応バージョン:>=2.8
[^1]
のように文章の任意の場所に脚注へのリンクを設置すると、ページの末尾の説明へ移動します。
説明は文章中の任意の場所で[^1]: <説明>
とすることで記述できます。
そのころわたくしは、モリーオ市の博物局に勤めて居りました。
十八等官 [^1]でしたから役所のなかでも、ずうっと下の方でしたし俸給[^2]もほんのわずかでしたが、受持ちが標本の採集や整理で生れ付き好きなことでしたから、わたくしは毎日ずいぶん愉快にはたらきました。
[^1]: ロシア帝国では、軍隊、政府、および宮廷における地位と階級を**[官等表](https://en.wikipedia.org/wiki/Table_of_Ranks)**と呼ばれるもので管理していました。
[^2]: 役所や会社に務める人の給料のことを指す言葉です。
結果
そのころわたくしは、モリーオ市の博物局に勤めて居りました。 十八等官1 でしたから役所のなかでも、ずうっと下の方でしたし俸給2もほんのわずかでしたが、受持ちが標本の採集や整理で生れ付き好きなことでしたから、わたくしは毎日ずいぶん愉快にはたらきました。
コードブロック
```
で囲むことでコードとして認識され、初めを```言語名
とすることでシンタックスハイライトがつきます。title="タイトル"
とすることでファイル名なども表現できます。
``` csharp title="Program.cs"
using System;
public class Program
{
public static void Main()
{
Console.WriteLine("Hello World!");
}
}
```
結果
using System;
public class Program
{
public static void Main()
{
Console.WriteLine("Hello World!");
}
}
hl_lines
属性を指定すると、特定の行を強調表示できます。
```csharp title="AnimalClasses.cs" hl_lines="6 20"
public class Animal
{
public string Name { get;set; }
public string Description { get;set; }
public virtual void Move()
{
throw new NotImplementedException();
}
}
public class Cat : Animal
{
public Cat()
{
this.Name = "たま";
this.Description = "吾輩は猫である。名前も決まっている。";
}
public override void Move()
{
/// ひっかく
}
}
```
結果
public class Animal
{
public string Name { get;set; }
public string Description { get;set; }
public virtual void Move()
{
throw new NotImplementedException();
}
}
public class Cat : Animal
{
public Cat()
{
this.Name = "たま";
this.Description = "吾輩は猫である。名前も決まっている。";
}
public override void Move()
{
/// ひっかく
}
}
注意
テーブルのデザインや一貫性の問題から、linenums=1
属性はLantana2.0から非推奨になりました。
インラインコードのハイライト
対応バージョン:>=2.12
`:::language code`
と書くことで、インラインコードにもシンタックスハイライトを適用できます。
結果
Pythonでモジュールを読み込むには、import
文を使います。
例えば、sys
モジュールを読み込むには、import sys
と書きます。
数式
\$\$
で囲むことでTeX記法を用いて数式を記述できます。
$
または\(...\)
で囲むことで、数式を文中に埋め込むこともできます。
ディッフィー・ヘルマン鍵共有プロトコルでは、まず大きな素数 ${\displaystyle p}p$ と、
${\displaystyle p-1}p-1$ を割り切る大きな素数 ${\displaystyle q}q$ を用意します。
また、 ${\displaystyle g}g$ を
${\displaystyle ({\mathbb {Z} }/p{\mathbb {Z} })^{\ast }}{\displaystyle ({\mathbb {Z} }/p{\mathbb {Z} })^{\ast }}$ の元で、
位数が ${\displaystyle q}q$ である値とします。
この ${\displaystyle p,q,g}{\displaystyle p,q,g}$ の値は公開されているものとします。
ディッフィー・ヘルマン鍵共有プロトコルでは、まず大きな素数 \({\displaystyle p}p\) と、 \({\displaystyle p-1}p-1\) を割り切る大きな素数 \({\displaystyle q}q\) を用意します。また、 \({\displaystyle g}g\) を \({\displaystyle ({\mathbb {Z} }/p{\mathbb {Z} })^{\ast }}{\displaystyle ({\mathbb {Z} }/p{\mathbb {Z} })^{\ast }}\) の元であり、位数が \({\displaystyle q}q\) である値とします。この \({\displaystyle p,q,g}{\displaystyle p,q,g}\) の値は公開されているものとします。
順序なしリスト
リストの上には空行が必要です。
結果- 文頭に"
*
"、"+
"、"-
"のいずれかを入れると順序なしリストになります - 記号のあとにはスペースが必要です
- 同じリストでは同じ記号を使うことを推奨します。
番号付きリスト
リストの上には空行が必要です。
結果- 文頭に"
数字.
"を入れると番号付きリストになります。 - "
数字.
"のあとにはスペースが必要です - すべての数字を1にすると、自動的に番号が付きます。
タスクリスト
順序なしリストの記述の後ろに[ ]を入れるとチェックボックスが生成されます。 また、チェックが入った状態のボックスを生成する場合は[x]を入力します。
結果- タスク1
- タスク2
水平線
結果URL
Urlやメールアドレスを書くだけで、自動的にリンクになります。
https://lantana.wsoft.ws
[email protected]
リンク
このサイト外へのリンクは新規タブで開かれます。
結果タイトル付きリンク
タイトルはリンクをホバーした時に表示されます。
結果リンクの使いまわし
結果また、linkという書き方もできます。
画像
結果
表
Bootstrapの制約により、ヘッダーでは左右中央揃えが適用されません
| Left align | Right align | Center align |
|:-----------|------------:|:------------:|
| This | This | This |
| column | column | column |
| will | will | will |
| be | be | be |
| left | right | center |
| aligned | aligned | aligned |
結果
Left align | Right align | Center align |
---|---|---|
This | This | This |
column | column | column |
will | will | will |
be | be | be |
left | right | center |
aligned | aligned | aligned |
引用
> 文頭に>を置くことで引用になります。
> 複数行にまたがる場合、改行のたびにこの記号を置く必要があります。
>
> 引用の中に別のMarkdownを使用することも可能です。
>
> > これはネストされた引用です。
文頭に>を置くことで引用になります。 複数行にまたがる場合、改行のたびにこの記号を置く必要があります。
引用の中に別のMarkdownを使用することも可能です。
これはネストされた引用です。
図形
Lantanaは規定でmermaid.jsをサポートします。mermaid.jsを使うと、複雑な図形を簡単に挿入できます。
対応バージョン:>=2.9
バージョン2.9以降では、MermaidPrecompile拡張機能の導入するか、Mermaid.jsのCDNをmkdocs.yml
内でextra_javascript
として読み込む必要があります。PreCompileを行うにはビルド時に、CDNを読み込むには使用者に、インターネット接続が必要です。
結果
アラート
目を引く形で説明したい場合、!!! 種類 "タイトル"
で囲みます。
メモ
note
で使用できる装飾です。リンクは自動的に適切な色になります。
Abstract
abstract
で使用できる装飾です。リンクは自動的に適切な色になります。
Info
info
で使用できる装飾です。リンクは自動的に適切な色になります。
Tip
tip
で使用できる装飾です。リンクは自動的に適切な色になります。
Success
success
で使用できる装飾です。リンクは自動的に適切な色になります。
Question
question
で使用できる装飾です。リンクは自動的に適切な色になります。
Warning
warning
で使用できる装飾です。リンクは自動的に適切な色になります。
Failure
failure
で使用できる装飾です。リンクは自動的に適切な色になります。
Danger
danger
で使用できる装飾です。リンクは自動的に適切な色になります。
Bug
bug
で使用できる装飾です。リンクは自動的に適切な色になります。
Example
example
で使用できる装飾です。リンクは自動的に適切な色になります。
Quote
quote
で使用できる装飾です。リンクは自動的に適切な色になります。
折り畳み要素
折り畳みを使用するには、??? タイトル
で囲みます。
??? "ポラーノの広場"
あのイーハトーヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモリーオ市、郊外のぎらぎらひかる草の波。
またそのなかでいっしょになったたくさんのひとたち、ファゼーロとロザーロ、羊飼のミーロや、顔の赤いこどもたち、地主のテーモ、山猫博士のボーガント・デストゥパーゴなど、いまこの暗い巨きな石の建物のなかで考えていると、みんなむかし風のなつかしい青い幻燈のように思われます。では、わたくしはいつかの小さなみだしをつけながら、しずかにあの年のイーハトーヴォの五月から十月までを書きつけましょう。
結果
あのイーハトーヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモリーオ市、郊外のぎらぎらひかる草の波。 またそのなかでいっしょになったたくさんのひとたち、ファゼーロとロザーロ、羊飼のミーロや、顔の赤いこどもたち、地主のテーモ、山猫博士のボーガント・デストゥパーゴなど、いまこの暗い巨きな石の建物のなかで考えていると、みんなむかし風のなつかしい青い幻燈のように思われます。では、わたくしはいつかの小さなみだしをつけながら、しずかにあの年のイーハトーヴォの五月から十月までを書きつけましょう。
記事一覧
= "" =
で囲い、その中にディレクトリを指定すると、そのディレクトリの記事一覧を出力します。
スニペットの埋め込み
--8<--
で囲い、その中にファイル名を書き込むと、そのファイルを埋め込みます。
HTMLの埋め込み
HTMLコードは、そのまま記述することで埋め込むことができます。
結果これはHTMLのH4タグです
属性の追加
{: 属性名}
とするとマークダウンで生成される要素に特定の属性を追加することができます。
以下のようなHTMLが生成されます