Streamlit中HTML渲染异常：仅首行正常其余显示为代码块

• 检查HTML渲染调用方式
  确保每条参考文献单独调用st.markdown()并开启unsafe_allow_html=True。如果是将所有内容拼接成一个大字符串一次性渲染，可能因换行、格式冲突导致解析异常。示例：

  # 推荐写法
  for ref in references:
      st.markdown(f"<p>{ref}</p>", unsafe_allow_html=True)
  # 避免写法
  all_refs = "\n".join([f"<p>{ref}</p>" for ref in references])
  st.markdown(all_refs, unsafe_allow_html=True)
  

• 核对HTML标签完整性
  遍历输出所有生成的HTML内容到控制台（print(生成的HTML)），检查每条参考文献的标签是否完全闭合（比如</p>、</div>），缺失闭合标签会导致后续内容被错误解析为代码块。

• 排查自定义CSS干扰
  临时注释掉所有自定义CSS代码，验证是否恢复正常渲染。如果恢复，逐步排查CSS规则，重点检查是否误将普通文本元素匹配到代码块样式（如.stCodeBlock相关规则）。

• 转义文本中的特殊字符
  数据源中的Markdown特殊字符（反引号、星号*、大于号>等）会被Streamlit解析为Markdown格式，导致内容被识别为代码块。使用html.escape()`转义文本内容：

  import html
  for ref in references:
      escaped_ref = html.escape(ref)
      st.markdown(f"<p>{escaped_ref}</p>", unsafe_allow_html=True)
  

• 验证Streamlit版本兼容性
  升级到Streamlit最新稳定版，或回退到之前已知正常的版本，排查是否因版本迭代导致的HTML解析规则变化。

• 测试容器组件的渲染上下文
  如果参考文献放在st.expander()、st.tabs等容器内，尝试将代码移到页面根层级测试，部分容器内的HTML渲染逻辑可能存在差异。

内容的提问来源于stack exchange，提问作者Faruk Kara