我正在尝试使用 font-awesome-kit 添加图标到 streamlit 应用程序中,并尝试了几种不同的方法但没有成功。
尝试 1
尝试为组件导入 JS 标签
st.write('<script src="https://kit.fontawesome.com/xyz.js" crossorigin="anonymous"></script>', unsafe_allow_html=True)
st.write('<i class="fa-duotone fa-calendar-days"></i>', unsafe_allow_html=True)
尝试 2 尝试为组件导入 CSS 标签
st.write('<link rel="stylesheet" href="https://kit.fontawesome.com/zax.css" crossorigin="anonymous">', unsafe_allow_html=True)
st.write('<i class="fa-duotone fa-calendar-days"></i>', unsafe_allow_html=True)
尝试 3 尝试使用 streamlit HTML 组件来呈现图标组件。
st.components.v1.html('<i class="fa-duotone fa-calendar-days"></i>')
作为一种解决方法,我目前正在使用 cloudflare 的 CDN,如下面的代码所述,它成功呈现了图标。
import streamlit as st
st.write('<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/all.min.css"/>', unsafe_allow_html=True)
st.write('<i class="fa-solid fa-trash"/>', unsafe_allow_html=True)
但是,当使用工具包时,在图标预期的位置没有收到任何输出。这里有什么想法吗?