Как включить два изображения рядом в Markdown для ноутбука IPython (Jupyter)?

Я пытаюсь вставить два изображения рядом в одну ячейку Markdown на ноутбуке. То, как я это делаю, было:

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

для того, чтобы иметь возможность масштабировать включенное изображение. Может ли кто-нибудь дать предложения по этому поводу?

Спасибо,


person Community    schedule 11.11.2015    source источник


Ответы (7)


Решение JMann мне не помогло. Но этот сработал

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

Я взял идею из этой блокнота.

person Salvador Dali    schedule 23.07.2016
comment
Необработанный HTML-код работал у меня, то есть без HTML и display - person Physbox; 19.03.2019

Вы можете создавать таблицы, используя вертикальные черты и дефисы, подобные этому.

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

см. синтаксис таблиц

person user2276686    schedule 25.02.2017
comment
К сожалению, не работает на Github. - person Markus Zeller; 16.02.2020
comment
Работает на Гитхабе. - person Krisztián Balla; 09.06.2020

У меня недостаточно репутации, чтобы добавлять комментарии, поэтому я просто добавлю свои 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>

тогда это работает.

person RandomWalker    schedule 26.08.2018
comment
Это сработало для меня с использованием ноутбука jupyter (намеренно с использованием html, а не [img](url) ) - person d-man; 16.04.2021

Я нашел следующие работы в ячейке 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>
person JMann    schedule 16.11.2015

Я использую VSCode с собственной уценкой, и это решение работает для меня с точки зрения...

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

Это потому, что мне нужно вставить много изображений на свой сайт. Вот так: введите здесь описание изображения

Итак, на первых двух картинках работает, а на остальных нет =/

Я считаю, что мне нужно добавить пробел между тегами изображений

Итак, я сделал это и отлично работает, как на прикрепленной картинке:

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

И это работало правильно для меня!

Я надеюсь, что это помогло вам!

person fabriciomasiero    schedule 29.04.2020

<table><tr>
<td> 
  <p align="center" style="padding: 10px">
    <img alt="Forwarding" src="images/IMG_20201012_183152_(2).jpg" width="320">
    <br>
    <em style="color: grey">Forwarding (Anahtarlama)</em>
  </p> 
</td>
<td> 
  <p align="center">
    <img alt="Routing" src="images/IMG_20201012_183158_(2).jpg" width="515">
    <br>
    <em style="color: grey">Routing (yönlendirme)</em>
  </p> 
</td>
</tr></table>

введите здесь описание изображения

person Hasan Tezcan    schedule 16.10.2020

Таблица картинок:

|![alt](pathToImage1.jpg) |![alt](pathToImage2.jpg)|
|-|-|
|![alt](pathToImage3.jpg) | ![alt](pathToImage4.jpg)
|![alt](pathToImage5.jpg) | ![alt](pathToImage6.jpg)

Вид :

alt alt
alt alt
alt alt
person Julien Jm    schedule 15.06.2021