我刚开始接触Markdown。我喜欢它,但有一件事困扰着我:如何使用Markdown更改图像的大小?
文档仅为图像提供以下建议:

如果可能的话,我希望图片也居中。我问的是Markdown将军,而不仅仅是GitHub是如何做到的。
我刚开始接触Markdown。我喜欢它,但有一件事困扰着我:如何使用Markdown更改图像的大小?
文档仅为图像提供以下建议:

如果可能的话,我希望图片也居中。我问的是Markdown将军,而不仅仅是GitHub是如何做到的。
当前回答
通过纯向后兼容MD:

其中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组件/应用程序来显示标记。
其他回答
如果我们只是像这样使用普通的HTML图像标记,那么它是有效的,如果您使用引导来进行样式设置。我在Jekyll制作的网站上使用这个。
<img class="img-fluid" src="./img/face.jpg" alt="img-verification">
如果我们按照这个例子添加引导类,它会很好地工作。
人们可以利用alt属性,该属性可以在几乎所有Markdown实现/渲染中设置,以及基于属性值的CSS选择器。优点是可以轻松定义一整套不同的图片大小(以及其他属性)。
标记:

CSS:
img[alt="minipic"] {
max-width: 20px;
display: block;
}
对于所有在R markdown/bookdown中工作的解决方案,上述解决方案不工作或需要略微调整:
工作
追加{width=50%}或{width=50%height=50%}{width=50%}{宽度=50%高度=50%}重要提示:宽度和高度之间没有逗号,即{width=50%,height=30%}不起作用!追加{height=“36px”width=“36px”}{height=“36px”width=“36px”}注意:带冒号的{:height=“36px”width=“36px”}(来自@sayth)似乎不适用于R markdown
不工作:
附加=宽度x高度在图形文件的URL之后调整图像大小(从@prosseek)两者都不=宽度x高度nor=仅宽度工作
如果更改初始标记对您来说不是一个选项,则此黑客可能会奏效:
newHtml = oldHtml.replace(/<img/g, '<img height="100"');
我使用它可以在发送电子邮件之前调整图像大小(因为Outlook忽略任何图像css样式)
供将来参考:
Joplin的Markdown实现允许以以下方式控制导入图像的大小:
<img src=“:/7653a812439451eb1803236687a70ca”width=“450”/>
这项功能是在这里请求的,正如Laurent承诺的那样,这项功能已经实现。
我花了一段时间才弄清楚乔普林的具体答案。