Markdownで画像を表示する方法は非常にシンプルです。画像を表示するには、以下のような構文を使います。
![画像の説明文](画像のURLまたはファイルパス)
具体例
ウェブ上の画像を表示する場合
ウェブ上の画像を表示するには、画像のURLを指定します。
![かわいい猫](https://example.com/cute-cat.jpg)
このように記述すると、「かわいい猫」という説明文とともに、指定したURLの画像が表示されます。
ローカルファイルの画像を表示する場合
ローカルファイルの画像を表示する場合は、ファイルパスを指定します。これはローカルのMarkdownエディタで利用する方法です。
![風景写真](./images/landscape.jpg)
ファイルがMarkdownファイルと同じディレクトリにある場合、相対パスを使って参照できます。
画像サイズを指定する方法
Markdown自体には画像サイズを指定する標準の構文はありませんが、HTMLを組み合わせてサイズを調整することができます。
<img src="https://example.com/cute-cat.jpg" alt="かわいい猫" width="300" height="200">
このように記述すると、HTMLのwidth
とheight
属性で画像サイズを調整できます。
画像のリンクを設定する
画像をクリックして別のリンク先に移動するようにするには、リンク構文と組み合わせます。
[![GitHubロゴ](https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png)](https://github.com)
この記述では、GitHubのロゴ画像が表示され、それをクリックするとGitHubのサイトにアクセスできます。