Markdown Toolbox Logo Markdown Toolbox
ブログ

Markdownで画像キャプションを追加するにはどうすればよいですか?

2023-12-18

Markdownで画像にキャプションを追加することは、画像の理解と文脈を向上させることができます。標準のMarkdownは画像キャプションを直接サポートしていませんが、それを含める方法はいくつかあります。

代替テキストをキャプションとして使用する

最も簡単な方法は、画像のaltテキストをキャプションとして使用することです:

![これは画像のキャプションです](image-url.jpg)

これにより、altテキストを持つ画像が表示され、キャプションとして機能します。

HTMLメソッド

より明示的なキャプションを使用するには、HTMLタグを使用できます:

<figure>
    <img src="image-url.jpg" alt="代替テキスト" />
    <figcaption>これは画像のキャプションです</figcaption>
</figure>

この方法では、キャプションが下にある画像が表示されます。<figure>タグは、自己完結型のコンテンツを表すために使用される意味的なHTML要素であり、しばしばキャプション(<figcaption>)を含み、画像に最適です。

キャプションサポート付きのMarkdownレンダラー

一部のMarkdownレンダラーや拡張機能は、画像キャプションのための構文をサポートしています。たとえば、Pandocにはキャプション付きの図のための構文があります。自分のMarkdown環境にそのような機能があるかどうか確認してください。

キャプションの見た目は、使用するMarkdownレンダラーやプラットフォームによって異なる場合があるため、ドキュメントが目的の環境でどのようにレンダリングされるかを確認することが重要です。