[英]Styling Accordion tab dash bootstrap component
I would like to change the tab colour and alignment to centralise it.我想更改标签颜色和 alignment 以集中它。 Thus far I've been using
到目前为止我一直在使用
style = {'textAlign': 'center'} and displace = flex option as well but that skews the content alignment. style = {'textAlign': 'center'} 和 displace = flex 选项也是如此,但这会扭曲内容 alignment。
Anyone knows how to use CSS to overwrite the title(item 1, item 2 and item 3 in this case) in the tab only任何人都知道如何使用 CSS 仅覆盖选项卡中的标题(在这种情况下为第 1 项、第 2 项和第 3 项)
import dash_bootstrap_components as dbc
from dash import html
accordion = html.Div(
dbc.Accordion(
[
dbc.AccordionItem(
[
html.P("This is the content of the first section"),
dbc.Button("Click here"),
],
title="Item 1",
),
dbc.AccordionItem(
[
html.P("This is the content of the second section"),
dbc.Button("Don't click me!", color="danger"),
],
title="Item 2",
),
dbc.AccordionItem(
"This is the content of the third section",
title="Item 3",
),
],
)
)
https://dash-bootstrap-components.opensource.faculty.ai/docs/components/accordion/ https://dash-bootstrap-components.opensource.faculty.ai/docs/components/accordion/
You need to change the styling for .accordion-button
to this:您需要将
.accordion-button
的样式更改为:
.accordion-button {
text-align: center;
display: block;
}
Place this in a .css
file under the assets
which should be placed on the same directory level as your application file.将其放在
assets
下的.css
文件中,该文件应与应用程序文件放在同一目录级别。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.