如何在 Markdown for IPython Notebook (Jupyter) 中并排包含两张图片？

How to include two pictures side by side in Markdown for IPython Notebook (Jupyter)?

提问by

I am trying to insert two pictures side by side in one Markdown cell on a notebook. The way I do it was:

我试图在笔记本上的一个 Markdown 单元格中并排插入两张图片。我这样做的方式是：

<img src="pic/scan_concept.png" alt="Drawing" style="width: 250px;"/> 

in order to be able to size the included picture. Can anyone gives suggestions on top of this?

为了能够调整包含的图片的大小。任何人都可以在此之上提出建议吗？

Thanks,

谢谢，

采纳答案by Salvador Dali

JMann's solution didn't work for me. But this one worked

JMann 的解决方案对我不起作用。但这个有效

from IPython.display import HTML, display
display(HTML("<table><tr><td><img src='img1'></td><td><img src='img2'></td></tr></table>"))

I took the idea from this notebook

我从这个笔记本中汲取了灵感

回答by JMann

I found the following works in a Markdown cell:

我在 Markdown 单元格中发现了以下作品：

    <tr>
    <td> <img src="Nordic_trails.jpg" alt="Drawing" style="width: 250px;"/> </td>
    <td> <img src="Nordic_trails.jpg" alt="Drawing" style="width: 250px;"/> </td>
    </tr>

回答by user2276686

You can create tables using pipes and dashes like this.

您可以像这样使用管道和破折号创建表格。

A | B
- | - 
![alt](yourimg1.jpg) | ![alt](yourimg2.jpg)

see Tables syntax

看表语法

回答by RandomWalker

I don't have enough reputation to add comments, so I'll just put my 2 cents as a separate answer. I also found that JMann's solution didn't work, but if you wrap his implementation with table tags:

我没有足够的声誉来添加评论，所以我将我的 2 美分作为单独的答案。我还发现 JMann 的解决方案不起作用，但如果你用表标签包装他的实现：

<table><tr>
<td> <img src="Nordic_trails.jpg" alt="Drawing" style="width: 250px;"/> </td>
<td> <img src="Nordic_trails.jpg" alt="Drawing" style="width: 250px;"/> </td>
</tr></table>

then it works.

那么它的工作原理。

回答by fabriciomasiero

I'm using VSCode, with native markdown and that solution works for me in terms ...

我正在使用 VSCode，带有原生降价功能，并且该解决方案适用于我......

![alt](yourimg1.jpg) | ![alt](yourimg2.jpg)

Its because I need to insert a lot of images on my website. Like this:

因为我需要在我的网站上插入很多图片。像这样：

So, it works on the first two pictures and the others, it doesn't work =/

所以，它适用于前两张图片和其他图片，它不起作用 =/

I find that I need to add some space between image tags

我发现我需要在图像标签之间添加一些空格

So, I did this and works fine, like the attached picture:

所以，我这样做了并且工作正常，就像附图一样：

![alt](yourimg1.jpg) | ![alt](yourimg2.jpg)
// space 1
// space 2
// space 3
![alt](yourimg1.jpg) | ![alt](yourimg2.jpg)
// space 1
// space 2
// space 3

And it worked properly for me!

它对我来说工作正常！

I hope that helped you!

我希望对你有帮助！