Markdownビューワを搭載している投稿型サイトでのMarkdownで画像貼り付けるときのサイズ指定

1748 ワード
画像 Markdown サイズ変更 Markdown テキストリンク

概要

Markdownビューワを搭載している投稿型サイトでのMarkdownで画像貼り付けるときのサイズ指定方法。

Qiitaでもできます。

Markdown一発ではかけないけどアップロードした後には画像のURLが確定するから、
その画像を参照しつつサイズ変更することをHTMLで書く

という形で対応する。

1. 画像をアップロードする

![保留.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/59542/9179f39e-40b3-9576-3075-65eec3777711.png)

上のようなリンクが表示される。

この時点での画像(保留.png)のサイズ

2. 画像添付のMarkdown書式を以下のようにHTMLで書き換える

※横幅(width)にサイズを指定して、縦幅(hight)は自動に任せる例

![保留.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/59542/9179f39e-40b3-9576-3075-65eec3777711.png)

→

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/59542/9179f39e-40b3-9576-3075-65eec3777711.png" width="20">

サイズ変更後の画像

参考

Changing image size in Markdown on Gitlab