在Streamlit中使用传统CSS

在Streamlit中使用传统CSS

最近在用Python第三方库Streamlit做一个web应用时，发现不能对文本进行样式的修改。于是去访问了一下streamlit的官方论坛：
https://discuss.streamlit.io/t/are-you-using-html-in-markdown-tell-us-why/96/18
发现Streamlit的开发人员的初衷是不让大家使用传统的html和css，为了避免一些安全问题。但同时，他们保留了一个参数（unsafe-allow-html）供使用者写html代码。

使用streamlit.markdown()函数

具体例子：
1.an example of loading custom CSS.

st.markdown('<style>h1{color: red;}</style>', unsafe_allow_html=True)

可以看到，这里最重要的一步是将unsafe_allow_html置为true，然后就可以写传统的css。

2.an example of loading a custom icon after I’ve included the icon CSS library using the hack above.

st.markdown('<i class="material-icons">face</i>', unsafe_allow_html=True)

另外，streamlit的作者鼓励大家自己写库函数
examples：

import streamlit as st
def local_css(file_name):
with open(file_name) as f:
st.markdown('<style>{}</style>'.format(f.read()), unsafe_allow_html=True)
def remote_css(url):
st.markdown('<style src="{}"></style>'.format(url), unsafe_allow_html=True)
def icon_css(icone_name):
remote_css('https://fonts.googleapis.com/icon?family=Material+Icons')
def icon(icon_name):
st.markdown('<i class="material-icons">{}</i>'.format(icon_name), unsafe_allow_html=True)

markdown所支持的一些语法：
https://github.github.com/gfm/

最后

以上就是贪玩学姐为你收集整理的在Streamlit中使用传统CSS的全部内容，希望文章能够帮你解决在Streamlit中使用传统CSS所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。