如何将卡片图像对齐到 Plotly Dash Bootstrap 组件的中心？

Question

有没有办法将 dbc.card 图像对齐到 Plotly Dash Bootstrap 的中心？我浏览了文档，但只能找到“顶部”和“底部”。谢谢。下面是代码片段：

import dash_bootstrap_components as dbc
import dash_html_components as HTML
card = dbc.Card(
[
    dbc.CardImg(src="/static/images/placeholder286x180.png", top=True),
    dbc.CardBody(
        [
            html.H4("Card title", className="card-title"),
            html.P(
                "Some quick example text to build on the card title and "
                "make up the bulk of the card's content.",
                className="card-text",
            ),
            dbc.Button("Go somewhere", color="primary"),
        ]
    ),
],
style={"width": "18rem"},)

Answer 1

需要解决同样的问题，这是我使用 Bootstrap cheatsheet:

找到的

dbc.CardImg(src="/static/images/placeholder286x180.png", className = 'align-self-center')

我是新手，所以它可能不是最正确的，但它对我有用。

如何将卡片图像对齐到 Plotly Dash Bootstrap 组件的中心？

How to align the card image to centre in Plotly Dash Bootstrap Component?

plotly-dash

plotly-python