是的,[`st.container`](/opt/miniconda3/envs/py312/lib/python3.12/site-packages/streamlit/__init__.py )默认情况下不支持横向滚动。它只支持垂直滚动。让我为您演示几种解决方案: ````python import streamlit as st def container_default(): st.title("📦 默认Container - 只有垂直滚动") long_text = "Lorem ipsum. 12345678901234567890123456789012345678901234567890123456789012345678901234567890" * 1000 with st.container(height=300, width=600, border=True): st.markdown(long_text) st.write("☝️ 上面的容器只能垂直滚动,长文本会自动换行") def container_with_horizontal_scroll(): st.title("↔️ 使用CSS实现横向滚动") # 方案1:真正的双向滚动(修复版) st.subheader("🔄 双向滚动 - 修复版") # 创建既宽又高的内容 wide_content = """

这个容器支持横向和纵向滚动

横向内容:AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA

正常换行内容:Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

""" # 添加多行表格数据 for i in range(50): wide_content += f""" """ wide_content += """
超长列名1超长列名1超长列名1 超长列名2超长列名2超长列名2 超长列名3超长列名3超长列名3 超长列名4超长列名4超长列名4 超长列名5超长列名5超长列名5
数据{i}-1数据{i}-1数据{i}-1 数据{i}-2数据{i}-2数据{i}-2 数据{i}-3数据{i}-3数据{i}-3 数据{i}-4数据{i}-4数据{i}-4 数据{i}-5数据{i}-5数据{i}-5

更多垂直内容...

这是一个高度为200px的彩色区域

""" # 添加滚动条样式 st.markdown(""" """, unsafe_allow_html=True) st.markdown(wide_content, unsafe_allow_html=True) st.write("☝️ 上面的容器支持真正的横向和纵向双向滚动") # 方案2:只有横向滚动的版本(原来的) st.subheader("↔️ 只有横向滚动版本") long_text_no_wrap = "Lorem ipsum dolor sit amet consectetur adipiscing elit " * 50 st.markdown(""" """, unsafe_allow_html=True) st.markdown(f'
{long_text_no_wrap}
', unsafe_allow_html=True) st.write("☝️ 上面的容器只支持横向滚动") # 方案3:垂直滚动版本 st.subheader("↕️ 只有垂直滚动版本") vertical_content = """
""" for i in range(20): vertical_content += f"

这是第{i+1}行文本内容,用于测试垂直滚动功能。

" vertical_content += "
" st.markdown(vertical_content, unsafe_allow_html=True) st.write("☝️ 上面的容器只支持垂直滚动") def container_code_block(): st.title("🔤 代码块容器 - 自带横向滚动") # 长代码行 long_code = """ def very_long_function_name_that_exceeds_normal_width(): very_long_variable_name = "this is a very long string that will definitely exceed the container width and require horizontal scrolling to view completely" another_very_long_variable = {"key1": "very_long_value_1", "key2": "very_long_value_2", "key3": "very_long_value_3"} return very_long_variable_name + str(another_very_long_variable) # 更多长代码行 print("This is a very long print statement that contains lots of text and will definitely require horizontal scrolling to see the complete content") """ with st.container(height=300, border=True): st.code(long_code, language="python") st.write("☝️ 代码块自动支持横向滚动") def container_dataframe(): st.title("📊 DataFrame容器 - 自带横向滚动") import pandas as pd # 创建宽DataFrame wide_df = pd.DataFrame({ f"很长的列名_{i}": [f"很长的数据内容_{j}_{i}" for j in range(20)] for i in range(15) }) with st.container(height=300, border=True): st.dataframe(wide_df, width='stretch') st.write("☝️ DataFrame自动支持横向滚动") def container_custom_html(): st.title("🎨 自定义HTML容器") # 创建表格数据 table_html = """
""" # 添加表格行 for i in range(20): table_html += f""" """ table_html += """
Very Long Column Header 1 Very Long Column Header 2 Very Long Column Header 3 Very Long Column Header 4 Very Long Column Header 5 Very Long Column Header 6
Very long data content {i}-1 Very long data content {i}-2 Very long data content {i}-3 Very long data content {i}-4 Very long data content {i}-5 Very long data content {i}-6
""" st.markdown(table_html, unsafe_allow_html=True) st.write("☝️ 自定义HTML表格支持横向和纵向滚动") def container_plotly_chart(): st.title("📈 Plotly图表 - 自带横向滚动") import plotly.graph_objects as go import pandas as pd # 创建宽图表数据 categories = [f"Category_{i}" for i in range(30)] values = [i * 10 + 50 for i in range(30)] fig = go.Figure(data=[ go.Bar(x=categories, y=values, name="Long Bar Chart") ]) fig.update_layout( title="Very Wide Bar Chart with Many Categories", width=1500, # 设置很宽的图表 height=400, xaxis_title="Categories (Very Long Names)", yaxis_title="Values" ) with st.container(height=450, border=True): st.plotly_chart(fig, width='content') st.write("☝️ Plotly图表在容器中自动支持横向滚动") def container_iframe(): st.title("🌐 iframe容器") iframe_html = """ """ with st.container(height=350, border=True): st.markdown(iframe_html, unsafe_allow_html=True) st.write("☝️ iframe内容可以有自己的滚动条") # 页面选择 page = st.radio("Select Container Type", [ "📦 Default Container (Vertical Only)", "↔️ CSS Horizontal Scroll", "🔤 Code Block Container", "📊 DataFrame Container", "🎨 Custom HTML Container", "📈 Plotly Chart Container", "🌐 Iframe Container" ]) if page == "📦 Default Container (Vertical Only)": container_default() elif page == "↔️ CSS Horizontal Scroll": container_with_horizontal_scroll() elif page == "🔤 Code Block Container": container_code_block() elif page == "📊 DataFrame Container": container_dataframe() elif page == "🎨 Custom HTML Container": container_custom_html() elif page == "📈 Plotly Chart Container": container_plotly_chart() elif page == "🌐 Iframe Container": container_iframe() ```` ## 总结: ### 🚫 **Streamlit Container的限制:** - [`st.container`](/opt/miniconda3/envs/py312/lib/python3.12/site-packages/streamlit/__init__.py )默认只支持垂直滚动 - 不提供内置的横向滚动功能 - 文本内容会自动换行 ### ✅ **实现横向滚动的方案:** 1. **CSS方案**:使用`overflow-x: auto`和`white-space: nowrap` 2. **代码块**:[`st.code()`](/opt/miniconda3/envs/py312/lib/python3.12/site-packages/streamlit/__init__.py )自带横向滚动 3. **DataFrame**:[`st.dataframe()`](/opt/miniconda3/envs/py312/lib/python3.12/site-packages/streamlit/__init__.py )自带横向滚动 4. **自定义HTML**:完全控制滚动行为 5. **Plotly图表**:支持宽图表的横向滚动 ### 📝 **推荐方案:** - **文本内容**:使用CSS方案 - **数据展示**:使用DataFrame或自定义HTML表格 - **代码展示**:使用[`st.code()`](/opt/miniconda3/envs/py312/lib/python3.12/site-packages/streamlit/__init__.py ) - **图表展示**:使用Plotly等支持滚动的图表库 如果您需要在容器中显示特定类型的内容并需要横向滚动,请告诉我具体的使用场景,我可以为您提供更针对性的解决方案!