streamlit中图片居中

在 Streamlit 中，可以通过 `st.image()` 函数来展示图片。要使图片居中，可以在该函数的参数中添加 `use_column_width=True` 参数。这样，Streamlit 会将图片缩放到当前列的宽度，并将其居中显示。

例如：

import streamlit as st
from PIL import Image

image = Image.open("example.jpg")
st.image(image, use_column_width=True, caption="Example image")

如果希望图片水平居中，可以使用 `st.beta_container()` 函数创建一个容器，然后将图片放置在容器中，并添加 `style={"justify-content": "center"}` 参数。这样，容器会将图片居中显示。

例如：

import streamlit as st
from PIL import Image

image = Image.open("example.jpg")

container = st.beta_container()
with container:
    st.image(image)
    st.write("Example image")
container.empty()

相关问题

streamlit设置图片大小与盒子大小相同

要将图像大小设置为与包含它的盒子大小相同，在Streamlit中，您可以使用CSS样式来设置图像的宽度和高度。以下是一个简单的示例，显示如何将图像大小设置为与包含它的盒子大小相同：

import streamlit as st

# 设置盒子大小
st.markdown(
    """
    <style>
    .box {
        width: 500px;
        height: 500px;
        border: 1px solid black;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    </style>
    """
)

# 在盒子中显示图像
st.markdown(
    """
    <div class="box">
        <img src="https://picsum.photos/500/500" style="max-width:100%; max-height:100%;">
    </div>
    """
)

在此示例中，我们首先使用Markdown字符串设置CSS样式。在样式中，我们使用`.box`选择器定义了一个盒子类，该类具有500x500像素的宽度和高度，并且具有黑色边框。我们还使用`display: flex`和`justify-content: center`和`align-items: center`属性将图像居中对齐。

然后，我们在另一个Markdown字符串中显示了一个`<div>`元素，该元素具有`box`类。在该`<div>`中，我们嵌入了一个`<img>`元素，该元素具有`src`属性设置为图像URL，并使用`style`属性将图像的最大宽度和最大高度设置为100％，以使其适应包含它的盒子大小。

这样，图像的大小就会自动调整为与包含它的盒子大小相同。您可以根据需要更改盒子的大小，并修改CSS样式以适应您的需求。