结合两个答案，我得出了一个解决方案，看起来可能没那么漂亮，但它奏效了！

它创建了一个具有特定大小的缩略图，可以单击该缩略图以获得最高分辨率的图像。

[<img src="image.png" width="250"/>](image.png)

这是一个例子！我在Visual Code和Github上测试了它。

由于反馈，我们知道这也适用于：

GitLab公司Jupyter笔记本

如果您正在为PanDoc编写MarkDown，可以执行以下操作：

![drawing](drawing.jpg){ width=50% }

这会将style=“width:50%；”添加到HTML＜img＞标记中，或将[width=0.5\textwidth]添加到LaTeX中的\includegraphics中。

资料来源：http://pandoc.org/MANUAL.html#extension-链接属性

当使用Flask时（我将其用于平面页面）。。。我发现，在markdown调用中的扩展中显式地启用（由于某种原因，默认情况下不是这样）“attr_list”可以实现这一点，然后可以使用属性（对于访问CSS也非常有用-例如，class=“my class”…）。

FLATPAGES_HML_RENDERER=prerender_jinja

以及功能：

def prerender_jinja(text):
    prerendered_body = render_template_string(Markup(text))
    pygmented_body   = markdown.markdown(prerendered_body, extensions=['codehilite', 'fenced_code', 'tables', 'attr_list'])
    return pygmented_body

然后在Markdown中：

![image](https://octodex.github.com/images/yaktocat.png "This is a tooltip"){: width=200px}

将相对维度添加到源URL将在大多数Markdown渲染器中进行渲染。

我们在Corilla中实现了这一点，因为我认为该模式符合现有工作流的预期，而不迫使用户依赖基本的HTML。如果你最喜欢的工具没有遵循类似的模式，那么值得提出一个功能请求。

语法示例：

![a-kitt.jpg]（//corilla.com/a-kitten-2xU3C2.jpg=200x200）

小猫的例子：

如果使用markdown，首先需要启用HTML渲染：

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

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

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

在Tiemes答案的基础上，如果您使用CSS 3，可以使用子字符串选择器：

此选择器将匹配以“-fullwidth”结尾的alt标记的任何图像：

img[alt$="-fullwidth"]{
  width:  100%;
  display: block;
}

然后，您仍然可以使用alt标记来描述图像。

上面的标记可能类似于：

![Picture of the Beach -fullwidth](beach.jpg)

我在Ghost markdown中使用过这个，而且效果很好。