我只是在一些图像编辑器中编辑图像-水平放大图像，因此当渲染器调整大小到页面宽度时，它会垂直缩小。

所以，只需添加一些透明的左右边距即可。

如果每个md文件中有一个图像，控制图像大小的一种简便方法是：

添加css样式如下：

## Who Invented JSON?
`Douglas Crockford`

Douglas Crockford originally specified the JSON format in the early 2000s.
![Douglas Crockford](img/Douglas_Crockford.jpg)

<style type="text/css">
    img {
        width: 250px;
    }
</style>

输出如下：

如果每个md页面中有更多的图像，那么控制每个图像或每个自定义标记的简便方法是在css中定义每个元素。对于img标记，我们可以有：

//在css或样式标签中：img[alt=“结果1”]{宽度：100px；}img[alt=“结果2”]{宽度：200px；}img[alt=“结果3”]{宽度：400px；}//尝试使用以下方法之一在文档中插入图像：<br/><img src=“https://i.stack.imgur.com/xUb54.png“alt=”结果1“><br/><img src=“https://i.stack.imgur.com/xUb54.png“alt=”结果2“><br/><img src=“https://i.stack.imgur.com/xUb54.png“alt=”结果3“><br/><br/>在md中：<br/>![结果1]（img/res-img-1.png）<br/>![结果2]（img/res-img-2.png）<br/>![结果3]（img/res-img-3.png）

对于某些Markdown实现（包括Mou和Marked 2（仅限macOS）），您可以在图形文件的URL后添加=WIDTHxHEIGHT以调整图像大小。不要忘记=前面的空格。

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

您可以跳过高度

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

和宽度

![](./pic/pic1s.png =x250)

通过纯向后兼容MD：

![<alt>](<imguri>#<w>x<h> "<title>")

其中w，h定义了要纵横适配的边界框，例如在Flutter包中https://pub.dev/packages/flutter_markdown

代码：https://github.com/flutter/packages/blob/9e8f5227ac14026c419f481ed1dfcb7b53961475/packages/flutter_markdown/lib/src/builder.dart#L473

重新考虑破坏兼容性的html解决方案，因为人们可能会使用本机/非html组件/应用程序来显示标记。

我知道这个答案有点具体，但它可能会帮助其他需要帮助的人。

由于许多照片是使用Imgur服务上传的，因此您可以使用此处详述的API来更改照片的大小。

当在GitHub问题评论中上传照片时，它将通过Imgur添加，因此如果照片非常大，这将非常有用。

基本上http://i.imgur.com/12345.jpg，你会把http://i.imgur.com/12345m.jpg对于中等大小的图像。

也许这一点最近有所改变，但Kramdown文档显示了一个简单的解决方案。

从文档中

Here is an inline ![smiley](smiley.png){:height="36px" width="36px"}.

And here is a referenced ![smile]

[smile]: smile.png
{: height="36px" width="36px"}

与Jekyll和Kramdown一起在github上工作。