在 Google Colab 中使用 JupyterDash 加载外部样式表

Question

我正在尝试使用 google colab 和 JupyterDash 构建一个基本的 dash 应用程序，但由于某种原因，我似乎无法使用 JupyterDash 引用外部样式表。我在调用外部样式表时尝试遵循与 dash 类似的语法，但会导致以下错误。

我的代码是什么样的：

external_stylesheets = ["https://codepen.io/somewhat-random-code/pen/QWdrZGQ.css"]

app = JupyterDash(__name__,external_stylesheets=external_stylesheets)    

app.layout = html.Div(id="main-container",children=[
html.Div(id="visuals-container", children=[

    html.Div(id="slider-container", children=[
        dcc.Slider(
            id='my-slider-1',
            min=0,
            max=len(daysList)-1,
            step=1,
            value=0,
        )
    ]),


    html.Div(id="map-container", children=[

        html.Div(id="result-graph")

    ]),


]),


html.Div(id="info-container", children=[
    html.Div(id='slider-output-container')
]),

]）

它输出什么：

使用外部样式表时应该是这样的：

我正在尝试添加外部样式表，以便能够自定义顶部颜色的破折号滑块组件，以更好地匹配应用程序的主题。我似乎无法急于阅读样式表。我很感激任何建议。谢谢。

Answer 1

如果有帮助的话，看起来原始 CSS 托管（即笔本身的 CSS）只能在 CodePen PRO 中访问。请参阅此回复。