『玩转Streamlit』--文本与标题组件
本篇准备开始介绍Streamlit的组件。
Streamlit的组件非常多,后续几篇打算按照用途的分类,介绍每个分类中最常用的组件。
本次从最简单的组件开始,介绍文本和标题相关的组件,也就是以下4个组件:
st.text:用于显示普通的文本内容st.title:用于显示页面的大标题st.header:用于显示一级标题st.subheader:用于显示二级标题
1. st.text 组件
st.text 是 Streamlit 中最基本的文本展示组件。
它的主要功能是显示普通的文本内容,没有特殊的格式或样式,
主要用于展示段落、说明性文字或任何不需要特殊强调的文本。
使用场景主要包括:
- 展示应用程序的说明文字
- 显示用户输入或动态生成的文本内容
- 作为其他组件之间的过渡文本
st.text既可以显示单行文本,也可以通过三引号来显示多行文本。
import streamlit as st
st.text("这是一个使用 st.text 显示的普通文本。")
st.text(
"""这是一个使用 st.text 显示的多行文本。
每一行都会单独显示,
并且保持原有的格式。"""
)

2. st.title 组件
st.title 是用于显示页面大标题的组件。
它的字体大且加粗,非常醒目,通常位于页面的顶部或重要内容的开头。
st.title 的主要作用是吸引用户的注意力,明确应用程序的主题或当前部分的核心内容。
它的使用场景有:
- 作为整个应用程序的标题
- 标识应用程序中的重要部分或章节
- 在页面顶部提供清晰的导航指示
st.title使用非常简单。
st.title("XXX数据应用程序")
3. st.header 组件
st.header 是用于显示一级标题的组件。
它的字体和加粗程度略小于 st.title,但仍然足够显眼,能够清晰地标识出页面内容的不同部分。
st.header 的主要作用是帮助用户理解应用程序的结构,快速定位到感兴趣的内容部分。
st.header可以当成HTML中的H1标签来看,它的使用场景主要有:
- 划分应用程序的不同区块或章节
- 为特定部分的内容提供标题
- 在长页面中提供视觉上的分隔
st.header的使用和st.title类似,下面的示例把它当作内容分割的标题。
import streamlit as st
st.header("引言")
st.text("本文介绍了 Streamlit 的基本文本展示组件。")
st.header("方法")
st.text("我们采用了多种方法来分析数据。")
st.header("结果")
st.text("以下是我们的分析结果。")

4. st.subheader 组件
st.subheader 是用于显示二级标题的组件。
相对于 st.header,它的字体和加粗程度进一步减小,但仍然能够清晰地标识出内容的子部分。
st.subheader 的主要作用是进一步细化内容结构,为用户提供更详细的导航或内容概述,可以把它当成HTML中的H2标签来看。
它的使用场景:
- 在一级标题下进一步划分内容子部分
- 为特定的小节或段落提供标题
- 在需要强调但不需要过分突出的地方使用
下面的示例展示二级标题的使用:
st.header("销售数据分析")
st.subheader("月度销售趋势")
st.text("这里将展示每月的销售数据趋势。")
st.subheader("年度销售趋势")
st.text("这里将展示整年的销售数据趋势。")
st.subheader("产品类别销售情况")
st.text("接下来,我们将分析不同产品类别的销售情况。")

5. 总结
上面介绍的4个组件st.text、st.title、st.header 和 st.subheader 并不是孤立存在的,它们通常会被组合在一起使用,以构建出具有层次感和逻辑性的页面布局。
使用时,根据内容层次选择组件,比如,
使用 st.title 作为整个页面或应用程序的开头,明确主题和核心目的;
使用 st.header 来划分页面的主要部分或章节,每个 st.header 都应该代表一个相对独立且完整的内容区块;
在 st.header 之下,使用 st.subheader 来进一步细化内容,为具体的小节或段落提供标题;
最后,用st.text 来填充上述标题之间的空白,提供具体的描述、解释或补充信息。
需要注意的是,虽然这些文本展示组件非常有用,但也要避免过度使用,过多的标题和文本可能会让用户感到混乱和迷失方向。
因此,在使用这些组件时,要确保它们真正为页面增加了价值,而不是成为冗余的信息。
『玩转Streamlit』--文本与标题组件的更多相关文章
- Github 恶搞教程(一起『玩坏』自己的 Github 吧)
最近在伯乐在线读到一篇趣文,<如何在 Github『正确』做贡献>,里面各种能人恶搞 Github 的『Public contributions』,下面截取几个小伙伴的战绩: 顺藤摸瓜,发 ...
- 『Python基础-4』字符串
# 『Python基础-4』字符串 目录 1.什么是字符串 2.修改字符串 2.1 修改字符串大小 2.2 合并(拼接)字符串 2.3 使用乘号'*'来实现字符串的叠加效果. 2.4 在字符串中添加空 ...
- 『心善渊』Selenium3.0基础 — 24、Selenium的expected_conditions模块详细介绍
目录 1.EC模块介绍 2.EC模块常用类 3.EC模块的使用 4.EC模块综合使用 (1)title_is(title)示例 (2)presence_of_element_located(locat ...
- 『Asp.Net 组件』Asp.Net 服务器组件 内嵌JS:让自己的控件动起来
代码: using System; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; namespace ...
- 『Asp.Net 组件』Asp.Net 服务器组件 内嵌图片:自己的图片控件
代码: using System; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; namespace ...
- 『Asp.Net 组件』Asp.Net 服务器组件 的开发优势和劣势
在写<Asp.Net 服务器组件系列文档>之前,笔者不才,揣测微软战略用意: 微软利益诉求莫过于 微软产品和技术的市场份额: 因此,微软战略之一莫过于将 所有开发人员 团聚在 微软周围,以 ...
- 2018-2019-2 20165316 『网络对抗技术』Exp3:免杀原理与实践
2018-2019-2 20165316 『网络对抗技术』Exp3:免杀原理与实践 一 免杀原理与实践说明 (一).实验说明 任务一:正确使用msf编码器,msfvenom生成如jar之类的其他文件, ...
- 2017-2018-2 20155303『网络对抗技术』Final:Web渗透获取WebShell权限
2017-2018-2 『网络对抗技术』Final:Web渗透获取WebShell权限 --------CONTENTS-------- 一.Webshell原理 1.什么是WebShell 2.We ...
- 2017-2018-2 20155303『网络对抗技术』Exp9:Web安全基础
2017-2018-2 『网络对抗技术』Exp9:Web安全基础 --------CONTENTS-------- 一.基础问题回答 1.SQL注入攻击原理,如何防御? 2.XSS攻击的原理,如何防御 ...
- 2017-2018-2 20155303『网络对抗技术』Exp8:Web基础
2017-2018-2 『网络对抗技术』Exp8:Web基础 --------CONTENTS-------- 一.原理与实践说明 1.实践具体要求 2.基础问题回答 二.实践过程记录 1.Web前端 ...
随机推荐
- CH06_函数
CH06_函数 概述 作用:将一段可复用的代码封装起来,减少代码重复. 一个较大的程序,一般分为若干个程序块,每个模块实现特定的功能. 函数的定义 函数的定义一般主要有5个步骤: 返回值类型 函数名 ...
- ARM架构及ARM指令集、Thumb指令集你了解多少?
https://www.sohu.com/a/339622340_100281310 1991 年ARM 公司成立于英国剑桥,在成立后的那几年,ARM业绩平平,工程师们也人心惶惶,害怕随时都会失业.在 ...
- Vue状态管理库Pinia详解
Pinia 是 Vue 的状态管理库,它提供了一种更简单.更不规范的 API 来管理应用的状态.Pinia 的设计哲学是简单性和易用性,它避免了 Vuex 中的许多复杂概念,如 mutations 和 ...
- 什么是电商API
是电子商务平台提供给开发者和商家的一种技术接口,它允许第三方应用程序访问和操作平台的数据和服务.电商API的使用可以极大地提高业务效率,促进创新,并且为商家提供更多的商业机会. 以下是电商API的 ...
- WinForm程序中使用Echarts图表
WinForm程序中使用Echarts 实现原理: WebBrowser + HTML 第一步:在窗体中添加WebBrowser控件 1.在工具箱中找到WebBrowser控件,拖动到窗体中 设置We ...
- 如何阅读 diff 命令的输出
diff 命令有三种模式:上下文模式(context),合并模式(unified)和普通模式(normal).其中最常用的是合并模式. 合并模式 diff -u f1 f2 --- f1 2024-0 ...
- 【Markdown】之使用教程
Markdown 教程 https://testerhome.com/markdown Guide 这是一篇讲解如何正确使用 Markdown 的排版示例,学会这个很有必要,能让你的文章有更佳清晰的排 ...
- jQuery - 不同版本的差异對比
jQuery 一共分了 1.x.2.x.3.x 这三个大版本. jQuery 的版本都是不向后兼容的! jQuery 的版本都是不向后兼容的! jQuery 的版本都是不向后兼容的!重要的事情说三遍哈 ...
- 项目发布后项目时间和linux时间不一致
查阅了很多资料,本来总以为是项目的问题,启动前端,连接不同的后台,本地项目时间是正确的,部署到linux Docker容器就不行.很纳闷...... 基于以上,还是决定记下来,以便后来的人查阅,解决问 ...
- Filter——过滤器
Filter Filter 快速入门 Filter 执行流程 1.放行前,对 request 数据进行处理 2.放行后,对 response 数据进行处理 ...