使用 Font-Awesome-Kit 将图标渲染到 Streamlit 应用程序中

问题描述 投票:0回答:0

我正在尝试使用 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)

但是,当使用工具包时,在图标预期的位置没有收到任何输出。这里有什么想法吗?

python font-awesome streamlit
© www.soinside.com 2019 - 2024. All rights reserved.