我想将CSS样式表或<style>块添加到Python Dash应用程序中。我曾尝试在下面做这两项,但对我都不起作用。该应用程序加载正常,但文本仍为黑色,而不是绿色。

import dash

from dash.dependencies import Input, Output
import dash_core_components as dcc
import dash_html_components as html
import plotly.graph_objs as go
from flask import send_from_directory



# define the app
app = dash.Dash()

app.head = [html.Link(rel='stylesheet', href='./static/stylesheet.css'),
    ('''
    <style type="text/css">
    h1 {
        color:green;
    }
    </style>
    ''')]

app.layout = html.Div(html.H1('Hello World!'))


if __name__ == '__main__':
    app.run_server(debug=True)

./static/stylesheet.css内部是一个仅包含以下内容的文件:
h1{
  color:green;
}

我尝试过仅具有样式表或仅具有<style>标记,但是这些都不能使h1标记变为绿色。

这是我为解决问题而进行的研究:

https://github.com/plotly/dash/pull/171

https://dash.plot.ly/external-resources

https://github.com/plotly/dash-recipes/blob/master/dash-local-css-link.py

我唯一没有尝试过的(那些链接建议)是从外部链接(CDN)加载。但是我希望能够离线加载此应用程序,所以这不是一种选择。

最佳答案

这是我做过的一个元素的一部分,它对样式很有用

app.layout = html.Div(
style={'backgroundColor': 'black'},
children=[
    html.H1('html code')])

关于Python Dash : Custom CSS,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/50844844/

10-14 07:06