在Markdown中更改图像大小

我刚开始接触Markdown。我喜欢它，但有一件事困扰着我：如何使用Markdown更改图像的大小？

文档仅为图像提供以下建议：

![drawing](drawing.jpg)

如果可能的话，我希望图片也居中。我问的是Markdown将军，而不仅仅是GitHub是如何做到的。

当前回答

供将来参考：

Joplin的Markdown实现允许以以下方式控制导入图像的大小：

这项功能是在这里请求的，正如Laurent承诺的那样，这项功能已经实现。

我花了一段时间才弄清楚乔普林的具体答案。

其他回答

我编写了在Jekyll中使用自定义大小img标记的简单标记解析器的脚本。

https://gist.github.com/nurinamu/4ccf7197a1bdfb0d7079

{% img /path/to/img.png 100x200 %}

可以将文件添加到_plugins文件夹。

供将来参考：

Joplin的Markdown实现允许以以下方式控制导入图像的大小：

这项功能是在这里请求的，正如Laurent承诺的那样，这项功能已经实现。

我花了一段时间才弄清楚乔普林的具体答案。

如果您正在使用kramdown，可以执行以下操作：

{:.foo}
![drawing](drawing.jpg)

然后将其添加到自定义CSS中：

.foo {
  text-align: center;
  width: 100px;
}

通过纯向后兼容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组件/应用程序来显示标记。

将图像URL放入下面的标记中。记住要相应地更改宽度和高度。这样地

<img src="IMAGE_URL_HERE"  width="300" height="300">

可以指定宽度而不指定高度属性，反之亦然。

或者，您可以使用百分比值更改图像大小，如下所示：

<img src="IMAGE_URL_HERE"  width=50% height=50%>

推荐文章