<h1 id="marp%E4%BD%BF%E3%81%A3%E3%81%9F%E3%82%B9%E3%83%A9%E3%82%A4%E3%83%89-%E8%87%AA%E5%88%86%E3%83%A1%E3%83%A2" data-line="0" class="code-line">
<a class="header-anchor-link" href="#marp%E4%BD%BF%E3%81%A3%E3%81%9F%E3%82%B9%E3%83%A9%E3%82%A4%E3%83%89-%E8%87%AA%E5%88%86%E3%83%A1%E3%83%A2" aria-hidden="true"></a> Marp使ったスライド 自分メモ</h1>
<h2 id="%E3%83%9A%E3%83%BC%E3%82%B8%E6%95%B0%E3%82%92%E5%8F%B3%E4%B8%8B%E3%81%AB%E8%A1%A8%E7%A4%BA%E3%81%99%E3%82%8B%E6%96%B9%E6%B3%95" data-line="2" class="code-line">
<a class="header-anchor-link" href="#%E3%83%9A%E3%83%BC%E3%82%B8%E6%95%B0%E3%82%92%E5%8F%B3%E4%B8%8B%E3%81%AB%E8%A1%A8%E7%A4%BA%E3%81%99%E3%82%8B%E6%96%B9%E6%B3%95" aria-hidden="true"></a> ページ数を右下に表示する方法</h2>
<p data-line="4" class="code-line">以下の記述をカスタムCSSファイルに記述しておく。</p>
<div class="code-block-container"><pre class="language-css"><code class="language-css code-line" data-line="6"><span class="token comment">/* ページ数を右下に表示 */</span>
<span class="token selector">section<span class="token pseudo-element">::after</span></span> <span class="token punctuation">{</span>
	<span class="token property">content</span><span class="token punctuation">:</span> <span class="token function">attr</span><span class="token punctuation">(</span>data-marpit-pagination<span class="token punctuation">)</span> <span class="token string">" / "</span> <span class="token function">attr</span><span class="token punctuation">(</span>data-marpit-pagination-total<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
</code></pre></div><h2 id="%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%A0css%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E3%81%AE%E8%A8%AD%E5%AE%9A" data-line="13" class="code-line">
<a class="header-anchor-link" href="#%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%A0css%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E3%81%AE%E8%A8%AD%E5%AE%9A" aria-hidden="true"></a> カスタムCSSファイルの設定</h2>
<p data-line="15" class="code-line">画像のようにmarpファイルの配置されたフォルダからみた相対パスを指定</p>
<p data-line="17" class="code-line"><img src="https://storage.googleapis.com/zenn-user-upload/20413dd5701f-20250224.png" alt="VScode設定" loading="lazy" class="md-img"></p>


Marp使ったスライド作成

ページ数を右下に表示する方法

Marp使ったスライド作成

Marp使ったスライド自分メモ

ページ数を右下に表示する方法

カスタムCSSファイルの設定

Discussion

Marp使ったスライド 自分メモ

ページ数を右下に表示する方法

カスタムCSSファイルの設定

Discussion

Marp使ったスライド自分メモ