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

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

![drawing](drawing.jpg)

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


当前回答

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

其他回答

也许这一点最近有所改变,但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上工作。

供将来参考:

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

<img src=“:/7653a812439451eb1803236687a70ca”width=“450”/>

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

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

这一条对我有用,它不在一条线上,但我希望它对你有用。

<div>
<img src="attachment:image.png" width="500" height="300"/>
</div>

这会奏效的

<style>
img{width: 50%;}
#foo {color: red;}
</style>

<p id="foo">foo</p>

<p style="color: blue">bar</p>

如果使用markdown,首先需要启用HTML渲染:

const md = require("markdown-it")({
  html: true,
});

然后可以在.md文件中使用:

<img src="" alt="drawing" width="100%" height="200"/>