是否可以更改多个页面的主体背景颜色？

Question

我的仪表板有多个页面，每个页面都包含顶部导航栏和容器。

在我的 style.css 文件中只有一个主体可以更改主体的背景颜色，目前我更改容器的背景颜色。

我的问题是：是否可以在从一页切换到另一页时更改整个正文的背景颜色？

page1_layout = html.Div([navbar_page1, container_page1])
page2_layout = html.Div([navbar_page2, container_page2])

container_page1 = html.Div([top_info_page1, grid_container_page1]
container_page2 = html.Div([top_info_page2, grid_container_page2]


:root {
    --text-color: #798d8f;
    --tab-color: #212529;
}

/* Add background color to entire app */
body {
    background-color: var(--text-color);
  }

#container-page1 {
    margin-left: 1%;
    margin-right: 1%;
}

#container-page2 {
    margin-left: 1%;
    margin-right: 1%;
    background-color: #DADADA;

Answer 1

试试这个：

document.body.style.backgroundColor= 'the color';

Answer 2

您可以给正文元素一个 class/id 并设置特定的 class/id 背景颜色

    <body id="page1">content</body>

    <body id="page2">content</body>

body{
background: red;
}
#page2{
background: blue !important;
}

是否可以更改多个页面的主体背景颜色？

Is it possible to change background color of main body for multiple pages?

css

plotly-dash