更改 ipywidgets 文本小部件中的描述颜色不起作用

Question

我正在尝试更改 Datalore 中 ipywidgets 文本小部件的描述颜色。我已将样式字典中的description_color属性设置为“白色”，目的是获得白色文本，但它似乎没有按预期工作。

这是我的代码的相关部分：

    import ipywidgets as widgets

    `    text_input = widgets.Text(
        value="",
        description="OCSF field:",
        style={"description_width": "initial", "description_color": "white"},
        layout=widgets.Layout(width='70%'),
    )

    text_input`

我在 Datalore 中尝试过这个（这是我需要它工作的地方），但它在 jupyter 笔记本中也不起作用。

是否应该有另一种方法来设置文本颜色？

Answer 1

对于运行当前技术的 Jupyter（JupyterLab 3.4+ 或 4 或 Jupyter Notebook 7+）

TL；博士

import ipywidgets as widgets
display(widgets.HTML("""
<style>
.my-label-style label {
    color: purple !important;
    font-weight: bold !important;
}
</style>
"""))
text_input = widgets.Text(
        value="",
        description="OCSF field:",
        style={"description_width": "initial"},
        layout=widgets.Layout(width='70%'),  _dom_classes=["my-label-style"]
    )

text_input

细节

您可以根据文档运行以下命令来获取使用代码块创建的text_input

小部件的样式属性列表：

text_input.style.keys 目前给出：

['_model_module',
 '_model_module_version',
 '_model_name',
 '_view_count',
 '_view_module',
 '_view_module_version',
 '_view_name',
 'background',
 'description_width',
 'font_size',
 'text_color']

如果你尝试

text_color

，就像这样：

import ipywidgets as widgets
text_input = widgets.Text(
        value="",
        description="OCSF field:",
        style={"description_width": "initial", "text_color": "red"},
        layout=widgets.Layout(width='70%'),
    )

text_input

你会发现这并没有给你想要的。

您会看到它为您输入的文本着色，而不是描述。

所以我们已经用尽了当前可用的样式属性。不过不用担心，请继续阅读...

调整描述文字样式

您可以通过使用开发人员工具查看引用的内容并使用CSS（如

此处所述）来自定义内容。还存在许多其他可能性。

具体示例：采用您的代码块并对其进行调整，使描述文本变为紫色和粗体

类似于您基于

此处和主要是此处的具体示例：

import ipywidgets as widgets
display(widgets.HTML("""
<style>
.my-label-style label {
    color: purple !important;
    font-weight: bold !important;
}
</style>
"""))
text_input = widgets.Text(
        value="",
        description="OCSF field:",
        style={"description_width": "initial"},
        layout=widgets.Layout(width='70%'),  _dom_classes=["my-label-style"]
    )

text_input