このテーマの特徴
テーマの特徴:
全体的なレイアウト:
- セクションが縦に並んだ列のレイアウトに設定されています。
- フォントサイズは 30 ポイントです。
ヘッダー:
- 幅がスライド全体に広がり、高さは 40 ピクセルです。
- 黒から濃いグレーへのグラデーション背景があります。
フッター:
- 固定され、スライドの下部に位置します。
- 幅はスライド全体に広がり、高さは 10 ピクセルです。
- 灰色から黒へのグラデーション背景があります。
タイトルセクション:
- 淡いグレーの背景色で、黒のテキストです。
- 20 ピクセルのパディングがあります。
- フォントサイズは 42 ポイントで、中央に配置され、縦方向に整列されます。
- 上下に 20 ピクセルの空白があります。
- フッターには黒の背景色があり、自動的に最下部に配置されます。
追加の機能:
- タイトルセクションのフッターのみが黒の背景色を持ち、残りのセクションのフッターはグラデーション背景を使用しています。
このテーマを利用する
CSS
/* @theme custom_theme */ @import default; section{ display: flex; flex-direction: column; font-size: 30pt; } header{ width: 100%; background: linear-gradient(to right, #000000, #434343); top: 0px; height: 40px } footer{ width: 100%; position: fixed; padding: 10px; background: linear-gradient(to right, #808080, #000000); bottom: 0px; } section.title{ background-color: #e0e0e0; color: #000000; padding: 20px; font-size: 42pt; text-align: center; display: flex; flex-direction: column; justify-content: center; gap: 20px; } section.title footer{ position: relative; background: #000000; margin-top: auto; }
Marpのサンプル
--- marp: true theme: custom_theme header: " " footer: " " --- # タイトル --- # 見出し - これはリスト - これもリスト