フォーマル グレー

このテーマの特徴

このCSSで作成されたマープのテーマの特徴は以下の通りです。

• 全体的な構造： セクションは縦方向のフレックスボックスで構成されています。

• ヘッダー： ヘッダーはページ上部に固定され、青と紫のグラデーション背景を持ちます。

• フッター： フッターはページ下部に固定され、紫と青のグラデーション背景を持ち、ページ番号が右下に表示されます。

• タイトルセクション： タイトルセクションは青緑色の背景を持ち、白で中央揃えのテキストを表示します。また、タイトルとサブタイトルの間に20pxのギャップがあります。

• タイトルセクションのフッター： タイトルセクションのフッターは、相対位置で紫色の背景を持ち、タイトルセクションの最下部に表示されます。

このテーマを利用する

CSS

/* @theme financial_report */
@import default;

section{
  display: flex;
  flex-direction: column;
  font-size: 24pt;
}

header{
  width: 100%;
  background: linear-gradient(to right, #364350, #54657d);
  top: 0px;
  height: 20px
}

footer{
  width: 100%;
  position: fixed;
  padding: 10px;
  background: linear-gradient(to right, #54657d, #364350);
  bottom: 0px; 
}

section.title{
  background-color: #6c757d;
  color: #e6e6e6;
  padding: 10px;
  font-size: 36pt;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 20px;
}

section.title footer{
  position: relative;
  background: #54657d;
  margin-top: auto;
}

Marpのサンプル

---
marp: true
theme: financial_report
header: " "
footer: " "
---
<!--
_class: title
-->

# 財務報告書

---
## はじめに

この報告書は、2023 年 3 月 31 日に終了した会計年度の当社の財務状況を概説しています。