Marp の履歴(No.4)

情報†

MarkdownでPDF形式のプレゼンテーションファイルを作成できるフリーソフト。

【VS Code + Marp】Markdownから爆速・自由自在なデザインで、プレゼンスライドを作る - Qiita (2020/06/28)
```
Visual Studio Code上で、Markdownから、こんな感じのデッキを生成できるようにします。
```

 mdの良さはもちろんシンプルさにあるのだが、装飾が何もないと、ダサい感じになってしまうので、今回ひと手間実施した。

サンプルプロジェクト・デザインのテンプレ配布も行い、git cloneするだけで作り始めることもできます。

Marp(Marpit)を使って、Markdownからスライドを作成します。

sectionタグに、以下のスタイルを書けば、本文を上詰めに変更できます。
section {
   justify-content: start;
}

justify-content： コンテンツを配置する基準位置を設定する項目。何も設定しないとデフォルトの center になってしまうので start がよい。

Marpの作者様から、単一画像のパーセンテージ指定はスライドサイズによって表示同一性が確保できないため、現状あえて対応していないとのことでした。

フラグメントを利用した画像の中央寄せ(右寄せ・左寄せも)【CSS】 - プログラムでおかえしできるかな
```
一手間は、画像の URL の末尾に #center を付加することです。
```

タイトルスライドをデザインしよう｜Marp入門〜応用｜markdownでプレゼン資料を楽に素早く作って発表しよう
```
タイトルスライド、と言っていますが、表紙のスライドのことです。こんなスライドを用意します。
```

次の部分では、スライドの表紙となるタイトルページの設定をしています。

Marp CLIは、npmでインストール出来ますが、公式リポジトリではnpxでの利用もおすすめされています。

Ctrl + ,で設定を開き、Markdown: Stylesに作成したCSSファイルのパスを記載します。