Python 调整两个Jupyter小部件之间的间距
我正在尝试创建一个Jupyter笔记本,以帮助一些同事以交互方式访问一些数据。我想给他们一些小部件,允许他们使用不同的标准来过滤数据 主要是它工作得很漂亮,但我无法调整两个小部件之间的间距,这会让我发疯 我试着按照说明去做,但这两个按钮总是紧挨着Python 调整两个Jupyter小部件之间的间距,python,css,jupyter-notebook,jupyter,ipywidgets,Python,Css,Jupyter Notebook,Jupyter,Ipywidgets,我正在尝试创建一个Jupyter笔记本,以帮助一些同事以交互方式访问一些数据。我想给他们一些小部件,允许他们使用不同的标准来过滤数据 主要是它工作得很漂亮,但我无法调整两个小部件之间的间距,这会让我发疯 我试着按照说明去做,但这两个按钮总是紧挨着 class Dashboard(object): def __init__(self): item_layout = Layout(flex='1 1 auto', wi
class Dashboard(object):
def __init__(self):
item_layout = Layout(flex='1 1 auto',
width='auto')
toggle = widgets.ToggleButtons(
options=["Foo", "Bar"],
value="Foo",
description="Foobar:",
disable=False,
layout=item_layout,
)
check = widgets.Checkbox(
value=True,
description="Checked",
disabled=False,
layout=item_layout,
)
box_layout = Layout(display='flex',
flex_flow='row',
justify_content='space around',
width='500px',
button_layout='solid',
)
buttons = widgets.Box(children=[
widgets.interactive(self._set_foobar, foobar=toggle, layout=item_layout),
widgets.interactive(self._set_checked, checked=check, layout=item_layout),
],
layout=box_layout)
display(buttons)
def _set_foobar(self, foobar):
self._foo = foobar == 'Foo'
def _set_checked(self, checked):
self._checked = bool(checked)
如果我打开Jupyter笔记本并执行以下操作:
import dashboard
y = dashboard.Dashboard()
它产生:
如果我没有使小部件具有交互性,即children=[toggle,check]
它工作得很好
是否有一种方法可以调整交互小部件之间的空间?在Jupyter中,您可以向各种小部件添加类。如果您有一个按钮小部件,请使用
add\u class()
函数向其添加一个类名。然后,使用display()
函数添加一些CSS
import ipywidgets as widgets
from IPython.core.display import display, HTML
but_1 = widgets.Button(
description = 'Button'
)
but_1.add_class("left-spacing-class")
display(HTML(
"<style>.left-spacing-class {margin-left: 10px;}</style>"
))
display(but_1)
将IPyWidget作为小部件导入
从IPython.core.display导入显示,HTML
但是_1=widgets.Button(
description='按钮'
)
但是1.添加类(“左间距类”)
显示(HTML)(
“.left间距类{左边距:10px;}”
))
显示(但_1)
您如何创建一个?我们需要检查最终结果,这样我们就可以看到发生了什么,并告诉您要修改什么来修复它。你能在这里重现这个行为吗?我做了一个编辑,但这和我能做的MCVE差不多。要查看结果,您需要保存代码,然后在笔记本中导入和实例化。我知道CSS。我不知道朱比特。我希望我能帮上忙。祝你好运!:)