调色板
主题颜色
主要
#007bff
禁用
次要
#6c757d
禁用
信息
#17a2b8
禁用
成功
#28a745
禁用
警告
#ffc107
禁用
危险
#dc3545
禁用
黑色/白色细微差别
黑色
#000000
禁用
深灰色
#343a40
禁用
灰色
#adb5bd
禁用
浅色
#1f2d3d
禁用
颜色
深紫色
#6610f2
禁用
浅蓝色
#3c8dbc
禁用
深蓝色
#001f3f
禁用
紫色
#605ca8
禁用
紫红色
#f012be
禁用
粉色
#e83e8c
禁用
褐红色
#d81b60
禁用
橙色
#ff851b
禁用
绿色
#01ff70
禁用
鸭翅绿
#39cccc
禁用
橄榄色
#3d9970
禁用
警告和标注
警告
警告！
Danger 警告预览。 此警告是可忽略的。 一种奇妙的宁静占据了我的整个灵魂，就像春天的早晨，我尽情享受。警告！
Info 警告预览。此警告是可忽略的。警告！
Warning 警告预览。此警告是可忽略的。警告！
Success 警告预览。此警告是可忽略的。.标注
我是 danger 标注！
我们需要解决一个问题。 一种奇妙的宁静占据了我的整个灵魂， 我尽情享受。
我是 info 标注！
请按照以下步骤继续付款。
我是 warning 标注！
这是黄色标注。
我是 success 标注！
这是绿色标注。
标签和卡片
标签
一种奇妙的宁静占据了我的整个灵魂，就像春天的早晨一样，
我尽情享受。
我孤身一人，感受她存在的魅力，
就像为幸福而创造的。我太快乐了，我亲爱的朋友，
沉迷在那宁静美妙，以至于忽视了我的才华。
我现在连一笔都画不出来，
但我觉得从来没有像现在一样是个伟大的艺术家。
欧洲语言同属一个语系。他们各自的存在是一个神话。
在科学、音乐、体育等方面，欧洲使用了相同的词汇。
这些语言只是在语法、发音和最常见的单词上有所不同。
每个人都意识到为什么需要一种新的通用语言：
人们可以拒绝支付昂贵的翻译费用。
要做到这一点，就必须有统一的语法、发音和更多的常用词。
如果几种语言合并在一起，结果语言的语法会比单个语言的语法更简单、更规则。
Lorem Ipsum 只是印刷和排版行业的虚拟文本。
自 15世纪以来，Lorem Ipsum 一直是该行业的标准虚拟文本，
当时一台不知名的打印机把一堆字拼凑在一起，做成了一本样书。
它不仅生存了五个世纪，而且跃进到电子排版，基本上保持不变。
20世纪60年代，随着包含 Lorem Ipsum 段落的莱斯泰特纸张的发布，
以及最近的包括 Lorem Ipsum 版本在内的 AldusPageMaker 桌面出版软件的发布，
它得到了普及。
进度条
大小不同的进度条
.progress
.progress-sm
.progress-xs
.progress-xxs
进度条
大小不同的垂直进度条
通过添加类 .vertical 和 .progress-sm， .progress-xs
或
.progress-xxs 我们实现：
垂直进度条
通过添加类 .vertical 我们实现：
Bootstrap 手风琴 & 轮播
可折叠手风琴
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
3
wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt
laborum
eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee
nulla
assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred
nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft
beer
farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
labore sustainable VHS.
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
3
wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt
laborum
eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee
nulla
assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred
nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft
beer
farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
labore sustainable VHS.
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
3
wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt
laborum
eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee
nulla
assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred
nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft
beer
farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
labore sustainable VHS.
版式
标题
h1. Bootstrap 标题
h2. Bootstrap 标题
h3. Bootstrap 标题
h4. Bootstrap 标题
h5. Bootstrap 标题
h6. Bootstrap 标题
强调文字
强调重要性
绿色文字强调成功
浅绿色文本强调信息
淡蓝色文本强调信息 (2)
红色文本强调危险
黄色文本强调警告
暗色文本以强调普通
主要块引用
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
佚名 源标题
次要块引用
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
佚名 源标题
无序列表
- Lorem ipsum dolor sit amet
- Consectetur adipiscing elit
- Integer molestie lorem at massa
- Facilisis in pretium nisl aliquet
- Nulla volutpat aliquam velit
- Phasellus iaculis neque
- Purus sodales ultricies
- Vestibulum laoreet porttitor sem
- Ac tristique libero volutpat at
- Faucibus porta lacus fringilla vel
- Aenean sit amet erat nunc
- Eget porttitor lorem
有序列表
- Lorem ipsum dolor sit amet
- Consectetur adipiscing elit
- Integer molestie lorem at massa
- Facilisis in pretium nisl aliquet
- Nulla volutpat aliquam velit
- Phasellus iaculis neque
- Purus sodales ultricies
- Vestibulum laoreet porttitor sem
- Ac tristique libero volutpat at
- Faucibus porta lacus fringilla vel
- Aenean sit amet erat nunc
- Eget porttitor lorem
无样式列表
- Lorem ipsum dolor sit amet
- Consectetur adipiscing elit
- Integer molestie lorem at massa
- Facilisis in pretium nisl aliquet
- Nulla volutpat aliquam velit
- Phasellus iaculis neque
- Purus sodales ultricies
- Vestibulum laoreet porttitor sem
- Ac tristique libero volutpat at
- Faucibus porta lacus fringilla vel
- Aenean sit amet erat nunc
- Eget porttitor lorem
描述
- Description lists
- A description list is perfect for defining terms.
- Euismod
- Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
- Donec id elit non mi porta gravida at eget metus.
- Malesuada porta
- Etiam porta sem malesuada magna mollis euismod.
水平描述
- Description lists
- A description list is perfect for defining terms.
- Euismod
- Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
- Donec id elit non mi porta gravida at eget metus.
- Malesuada porta
- Etiam porta sem malesuada magna mollis euismod.
- Felis euismod semper eget lacinia
- Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.