『玩转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前端 ...
随机推荐
- 国产崛起,Solon:我们的性能是 Spring 的 300%
Solon 应用开发框架(java framework).是从零开始构建,有自主的标准规范与开放生态.纯血国产. 追求: 更快.更小.更简单 提倡: 克制.简洁.高效.开放.生态 相对于 Spring ...
- Linux查看硬件信息超强命令sar,以及可视化工具ksar
一.概述 sar(System Activity Reporter,系统活动情况报告)是Linux下系统运行状态统计工具,可从多方面对系统的活动进行报告,包括:文件的读写情况.系统调用的使用情况.磁盘 ...
- windows权限维持汇总
Windows 权限维持 一.文件层面 1)attrib 使用 Attrib +s +a +h +r 命令 s:设置系统属性(System) a:设置存档属性(Archive) h:设置隐藏属性(Hi ...
- 【YashanDB知识库】ODBC驱动类问题定位方法
[标题]ODBC驱动类问题定位方法 [需求分类]故障分析 [关键字]ODBC [需求描述]由于我们的ODBC接口目前尚不完善,经常会遇见ODBC接口能力不足导致应用功能无法运行的问题,需要定位手段确定 ...
- Redis 入门 - 图形化管理工具如何选择,最全分类
工欲善其事必先利其器,上一章Redis服务环境已经搭建完成,现在就需要一个趁手的工具,有个好工具可以做到事半功倍. Redis图形化管理工具五花八门,可供选择的很多,大家可以根据自己的需求应用场景进行 ...
- 『面试题』WEB前端面试专题-Promise相关
题目一 const promise = new Promise((resolve, reject) => { console.log(1); resolve(); console.log(2); ...
- 如何将图片转换为向量?(通过DashScope API调用)
本文介绍如何通过模型服务灵积DashScope将 图片转换为向量 ,并入库至向量检索服务DashVector中进行向量检索. 模型服务灵积DashScope,通过灵活.易用的模型API服务,让各种模态 ...
- 第42天:WEB攻防-PHP应用&MYSQL架构&SQL注入&跨库查询&文件读写&权限操作 - 快捷方式
接受的参数值未进行过滤直接带入SQL查询 MYSQL注入:(目的获取当前web权限) 1.判断常见四个信息(系统,用户,数据库名,版本) 2.根据四个信息去选择方案 root用户:先测试读写,后测试获 ...
- 【赵渝强老师】MongoDB的inMemory存储引擎
一.MongoDB的存储引擎概述 存储引擎(Storage Engine)是MongoDB的核心组件,负责管理数据如何存储在硬盘(Disk)和内存(Memory)上.从MongoDB 3.2 版本开始 ...
- CSP 联训 3
好吧,又倒数了,就签了个 T2,100 pts. T1 我把相同颜色的存起来,每种颜色找出枚举选哪两个座位不合法的矩阵的左上和右下,如果找到的矩阵左下和右上也相同,则这个矩阵确实不合法,减去,但判断左 ...