Html 如何在Jupyter笔记本中以交互方式切换图像

如果我在Jupyter笔记本的标记单元格中写下以下内容，我会看到保存在“

Images

”文件夹中的图像

但我得到的所有图像都是这样一个接一个地堆叠起来的（我希望它们一次一个地出现在屏幕上）：

---

提前谢谢

您需要一些javascript/css，而

标记
单元格不支持这些内容。而是用python显示一个HTML文档。给你：

从IPython.core.display导入显示，HTML
html=”“”
选择一个图像：
图1
图2
图3
函数show1（）{
document.getElementById（'image1'）.style.display='block'；
document.getElementById（'image2'）.style.display='none'；
document.getElementById（'image3'）.style.display='none'；
}
函数show2（）{
document.getElementById（'image2'）.style.display='block'；
document.getElementById（'image1'）.style.display='none'；
document.getElementById（'image3'）.style.display='none'；
}
函数show3（）{
document.getElementById（'image3'）.style.display='block'；
document.getElementById（'image1'）.style.display='none'；
document.getElementById（'image2'）.style.display='none'；
}
show1（）
"""
显示（HTML（HTML））

哇！谢谢@juanesarango。它起作用了！
<img src="Images/T1.png"> 

<input type="radio" name="T1" class="radio1" checked/>
<input type="radio" name="T2" class="radio2" />
<input type="radio" name="T3" class="radio3" />


<div class="image1">
  <img src="Images/T1.png">
</div>
<div class="image2">
  <img src="Images/T2.png">
</div>
<div class="image3">
  <img src="Images/T3.png">
</div>