将 css 添加到 IPython.display 以使其成为 100% 的父级

Question

我正在使用 IPython.display 库在 Jupyter 笔记本中显示图像。

activeViewFromArray = ipywidgets.Output()
with activeViewFromArray:
    display(PIL.Image.fromarray(array))

如何向其中添加css 以使此显示调用生成的<img> 的宽度为父容器的100%？

如果我检查页面，我可以通过将 <img> 标记的样式更新为 width:100% 轻松地手动使其 100%

但是，如果我只是在 css 文件中设置它，所有 <img> 标记都会获得 100% 的宽度。

Answer 1

可以通过向父级添加一个类，然后在css 中访问父级的img 子级来完成

activeViewFromArray = ipywidgets.Output()
activeViewFromArray.add_class('img_array')

with activeViewFromArray:
    display(PIL.Image.fromarray(array))

CSS

.img_array img {
    width: 100%;
}