dash-bootstrap-按钮2

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.Button("Success", outline=True, color="success"),
        # disabled=True禁用
        dbc.Button("Warning-禁用", outline=True, color="warning", disabled=True),
        dbc.Button(
            "Info",
            outline=True,
            color="info",
        ),
    ],
    # d-gird 改变屏幕的尺寸的时候，还是铺满屏幕宽度
    # d-{xs|sm|md|lg|xl|xxl}-grid  改变屏幕相对应大小的时候才会铺满屏幕的宽度
    # 使用网格列宽类来调整块按钮的宽度 col-6  水平居中mx-auto  mx-{0,1,2,3,4,5}设置相对于左边的距离
    # d-md-block 改变屏幕变大的时候按钮会变小
    # justify-content-end从行尾开始排列
    className="d-grid gap-2  d-md-flex justify-content-md-end",
)

button2 = html.Div(
    [
        dbc.Button(
            "下载",
            href="/static/data_file.txt",
            external_link=True,
            color="primary",
        )
    ]
)

# app.layout = dbc.Container(button, fluid=True)
app.layout = dbc.Container([button1, button, button2], 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)