Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Changing image size in Markdown

Tags:

markdown

image

I just got started with Markdown. I love it, but there is one thing bugging me: How can I change the size of an image using Markdown?

The documentation only gives the following suggestion for an image:

![drawing](drawing.jpg) 

If it is possible I would like the picture to also be centered. I am asking for general Markdown, not just how GitHub does it.

like image 991
cantdutchthis Avatar asked Feb 03 '13 18:02

cantdutchthis


People also ask

Can you resize an image in Markdown?

There are a lot of Markdown flavors, but the ones that most of you are familiar with is Github Flavor Markdown (GFM). Unfortunately, the syntax does not support resizing image syntax out of the box. In order to change the image size in Markdown, you have to use raw HTML.


2 Answers

With certain Markdown implementations (including Mou and Marked 2 (only macOS)) you can append =WIDTHxHEIGHT after the URL of the graphic file to resize the image. Do not forget the space before the =.

![](./pic/pic1_50.png =100x20) 

You can skip the HEIGHT

![](./pic/pic1s.png =250x) 

And Width

![](./pic/pic1s.png =x250) 
like image 40
prosseek Avatar answered Oct 14 '22 18:10

prosseek


You could just use some HTML in your Markdown:

<img src="drawing.jpg" alt="drawing" width="200"/> 

Or via style attribute (not supported by GitHub)

<img src="drawing.jpg" alt="drawing" style="width:200px;"/> 

Or you could use a custom CSS file as described in this answer on Markdown and image alignment

![drawing](drawing.jpg) 

CSS in another file:

img[alt=drawing] { width: 200px; } 
like image 191
Tieme Avatar answered Oct 14 '22 19:10

Tieme