首页 > 解决方案 > 使用 ipyvuetify 更改多行复选框的外观

问题描述

我想用 ipyvuetify 创建一个多行复选框:

v.Col(children=[vue.Checkbox(label='UNO'),vue.Checkbox(label='DOS'),vue.Checkbox(label='TRES'),vue.Checkbox(label='CUATRO')])

结果如下:

在此处输入图像描述

如何修改组件以使复选框行彼此靠近?

谢谢

标签: pythonipywidgetsipyvuetify

解决方案


您可以通过vuetifys CSS 间距类指定边距和填充来做到这一点。在这里,我使用负边距使它们更加靠近。这一切都在链接中进行了解释:

vue.Col(
    children = [
        vue.Checkbox(
            class_='ma-n3',
            label='UNO'
        ),
        vue.Checkbox(
            class_='ma-n3',
            label='DOS'
        ),
        vue.Checkbox(
            class_='ma-n3',
            label='TRES'
        ),
        vue.Checkbox(
            class_='ma-n3',
            label='CUATRO'
        )
    ]
)

推荐阅读