Pagedown Markdown 编辑器：图像问题答案

【问题标题】：Pagedown Markdown editor : issue with imagesPagedown Markdown 编辑器：图像问题
【发布时间】：2015-03-27 19:04:27
【问题描述】：

使用PageDown时，插入太大的图片会出现问题。

它没有重新调整到适合编辑器宽度的尺寸（<img src="" width="..."> 可以做到这一点）

如何使用 Markdown 使图像适合容器？ （这是在 StackOverflow 的编辑器上完成的）

【问题讨论】：

【解决方案1】：

您可以在 URL 后附加 =WIDTHxHEIGHT 以调整图像大小。不要忘记=之前的空格

![](./applePie.png =100x200)

高度也是可选的，所以你可以这样做......

![](./applePie.png =100x)

如果您指的是 StackOverflow 图像，这里有一个很好的描述：https://stackoverflow.com/editing-help#images

【讨论】：

当我们使用PageDown 编辑器输入一些markdown 时，它会创建：![enter image description here][1] 和[1]: http://www.example.com/file.jpg... 我试图将后者修改为[1]: http://www.example.com/file.jpg =100x200，但它不起作用。
看看我提供的链接，特别是You can also use standard HTML image syntax, which allows you to scale the width and height of the image. 不出现所以允许完整的markdown图像语法，如果你想控制你需要使用HTML的尺寸。

【解决方案2】：

使用 Pagedown 编辑器时

它最终通过添加来工作

#wmd-preview img { max-width: 500px; }

所有图片（即使是大图片）的最大宽度为 500 像素。

【讨论】：

【解决方案3】：

与您提供的编辑器一起使用的唯一方法是：

<img src="https://upload.wikimedia.org/wikipedia/commons/4/4b/Apple_pie.jpg" width="200" height="200" />

哪个渲染：

代替：

但它不是降价精神......

【讨论】：

@Basj 恐怕 Markdown 无法处理这个问题。顺便说一句，SE 网站包装了降价内容以使其正常工作
当在这里使用 Pagedown 编辑器markitdown.net/markdown 时，我们是否可以添加一些自定义 CSS 以使每个嵌入图像的最大宽度为 500 像素？ @Thomas 这怎么可能？
@Basj 你的意思是，当你使用 this 编辑器或者你想创建/捆绑你自己的？
我的意思是使用 Pagedown 编辑器（在问题中链接），这里有一个演示：pagedown.googlecode.com/hg/demo/browser/demo.html。我终于按照您的建议解决了它（包装内容）。我会尽快奖励赏金（剩余 23 小时）。
@Basj: img {max-width:100%} 在 CSS 中很常见（不要让图像伸出其周围的容器）。您可以使用 500px 而不是 100% 并查看它会将您引向何方。