我使用st.markdown來顯示多選標簽的自定義顏色。然而，我注意到我在兩個多選選項之間創建了額外的空白(垂直的)。 下面是我正在使用的代碼。

import streamlit as st

st.set_page_config(layout="wide", page_title="Police Report Triaging")
st.subheader("Key information")
   col3, col4 = st.columns([0.5,2.5])
   person_list = ['Victim','Accused','Suspect','Witness'] 
   for person in person_list:
         st.markdown(
            f"""
            <style>
            span[data-baseweb="tag"]:has(span[title="{person}"]) {{
            background-color: #1E90FF !important;
            }}
            </style>
            """,
         unsafe_allow_html=True,
         )
   with col3:
      st.multiselect(
            label="Person",
            default = ["Victim"],
            options= person_list
      )
   with col4:
      st.markdown('#')
      st.write("**Name**: Samuel")

   col5, col6 = st.columns([0.5,2.5])   
   with col5:
      st.multiselect(
            label="Person",
            default = ["Accused"],
            options= person_list
      )
   
   with col6:
      st.markdown('#')
      st.write("**Name**: Bob")

我不知道如何減少多余的空白。

沒有可見內容的Markdown，例如您的CSS(& lt；style & gt...& lt/style & gt；)會產生空白。首先初始化col3和col4，然后將CSS寫入列下的主體。因此，第一行首先顯示，然后是空白(CSS)，接著是下一行，因為接下來初始化col5和col6。

最簡單的解決方案是確保任何& quot無形降價& quot元素是最后放在頁面上的東西，而不是混合在中間。這將使多余的空白不那么明顯。這是我通常推薦的，在很多用例中已經足夠了。

如果你真的需要更多的控制和混合0高度的線條，你可以通過st.components.v1.html在頁面上渲染時設置高度。這里需要注意的是，雖然HTML元素的高度為0，但是元素之間的間隙會導致出現雙間隙。(例如，可見的東西、間隙、零高度的東西、間隙、可見的東西)

這個身高問題目前在GitHub中被跟蹤，我在這里寫了一個JavaScript解決方案來解決它: https://github . com/streamlit/streamlit/issues/6605 # issue comment-1530232607