dash-bootstrap-按钮

from logging import debug
import dash
from dash import Input, Output, State, html
import dash_bootstrap_components as dbc
from dash_bootstrap_components.themes import BOOTSTRAP

app = dash.Dash(external_stylesheets=[dbc.themes, BOOTSTRAP])

# button = html.Div(
#     [
#         dbc.Button("点击", id="example-button", className="me-2", n_clicks=0),
#         html.Span(id="example-output", style={"verticalAlign": "middle"}),
#         # outline=True 设置轮廓按钮样式,删除轻量级样式的背景图像和颜色。
#         # size 改变按钮的大小  sm和lg表示小、大按钮
#         dbc.Button(
#             "Primary -大按钮", outline=True, size="lg", color="primary", className="me-1"
#         ),
#         dbc.Button(
#             "Secondary - 小按钮",
#             outline=True,
#             size="sm",
#             color="secondary",
#             className="me-1",
#         ),
#         dbc.Button("Danger", outline=True, color="danger", className="me-1"),
#         dbc.Button("Info", outline=True, color="info", className="me-1"),
#         dbc.Button("Light", outline=True, color="light", className="me-1"),
#         dbc.Button("Dark", outline=True, color="dark"),
#     ]
# )

button1 = html.Div(
    [
        dbc.Row(
            [
                dbc.Col(dbc.Button("Success", color="success")),
            ]
        ),
        dbc.Row(
            [
                dbc.Col(
                    dbc.Button("Success", color="success"),
                ),
                dbc.Col(dbc.Button("Warning", color="warning")),
            ]
        ),
        dbc.Row(
            [
                dbc.Col(dbc.Button("Success", color="success")),
                dbc.Col(dbc.Button("Warning", color="warning")),
                dbc.Col(dbc.Button("Info", color="info")),
                dbc.Col(dbc.Button("Info", color="secondary")),
            ],
            className="d-0",
        ),
        dbc.Row(
            [
                dbc.Col(dbc.Button("Success", color="success")),
                dbc.Col(dbc.Button("Warning", color="warning")),
                dbc.Col(dbc.Button("Info", color="info")),
                dbc.Col(dbc.Button("Info", color="secondary")),
            ]
        ),
        dbc.Row(
            [
                dbc.Col(dbc.Button("Success", color="success")),
                dbc.Col(dbc.Button("Warning", color="warning")),
                dbc.Col(dbc.Button("Info", color="info")),
                dbc.Col(dbc.Button("Info", color="secondary")),
            ]
        ),
    ]
)


# app.layout = dbc.Container(button, fluid=True)
app.layout = dbc.Container(button1, fluid=True)


# @app.callback(
#     Output("example-output", "children"), [Input("example-button", "n_clicks")]
# )
# def on_button_click(w):
#     if w is None:
#         return "无法点击."
#     else:
#         return f"Clicked {w} times."


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

你可能感兴趣的:(dash框架,bootstrap,python)