Bootstrap 类 参考
所有 Bootstrap 类别的完整列表
所有 Bootstrap 类别的完整列表,包括描述和示例
类 | 描述 | 示例 | 类别 |
---|---|---|---|
.active |
为表格行 (<tr> ) 或表格单元格 (<td> ) 添加灰色背景颜色(与悬停时使用的颜色相同) |
试试看 | 表格 |
.active |
为默认导航栏中活动的链接添加灰色背景颜色。为反向导航栏中当前链接添加黑色背景和白色颜色。 | 试试看 | 导航栏 |
.active |
为列表组中活动的列表项添加蓝色背景颜色 | 试试看 | 列表组 |
.active |
添加蓝色背景颜色来模拟“按下”的按钮 | 试试看 | 按钮 |
.active |
为进度条添加动画条纹 | 试试看 | 进度条 |
.active |
为下拉菜单中活动的下拉菜单项添加蓝色背景颜色 | 试试看 | 下拉菜单 |
.active |
为活动的分页链接添加蓝色背景颜色(突出显示当前页面) | 试试看 | 分页 |
.affix |
Affix 插件允许元素固定(锁定/粘贴)到页面上的某个区域。它在 position:fixed 上打开和关闭 |
试试看 | 固定 |
.alert |
创建一个警报消息框 | 试试看 | 警报 |
.alert-danger |
红色警报框。表示危险或潜在的负面行为 | 试试看 | 警报 |
.alert-dismissible |
与 .close 类一起,此类用于关闭警报 |
试试看 | 警报 |
.alert-info |
浅蓝色警报框。表示一些信息 | 试试看 | 警报 |
.alert-link |
用于警报中的链接,以添加匹配颜色的链接 | 试试看 | 警报 |
.alert-success |
绿色警报框。表示成功或积极的行为 | 试试看 | 警报 |
.alert-warning |
黄色警报框。表示应谨慎对待此操作 | 试试看 | 警报 |
.badge |
创建一个圆形徽章(灰色圆圈 - 通常用作数字指示器) | 试试看 | 徽章 |
.bg-danger |
为元素添加红色背景颜色。表示危险或负面行为 | 试试看 | 辅助 |
.bg-info |
为元素添加浅蓝色背景颜色。表示一些信息 | 试试看 | 辅助 |
.bg-primary |
为元素添加蓝色背景颜色。表示重要的事物 | 试试看 | 辅助 |
.bg-success |
为元素添加绿色背景颜色。表示成功或积极的行为 | 试试看 | 辅助 |
.bg-warning |
为元素添加黄色背景颜色。表示警告或负面行为 | 试试看 | 辅助 |
.breadcrumb |
分页。指示当前页面在导航层次结构中的位置 | 试试看 | 分页 |
.btn |
创建一个基本按钮(灰色背景和圆角) | 试试看 | 按钮 |
.btn-block |
创建一个块级按钮,跨越父元素的整个宽度 | 试试看 | 按钮 |
.btn-danger |
红色按钮。表示危险或负面行为 | 试试看 | 按钮 |
.btn-default |
默认按钮。白色背景和灰色边框 | 试试看 | 按钮 |
.btn-group |
将按钮分组在同一行上 | 试试看 | 按钮组 |
.btn-group-justified |
使一组按钮跨越屏幕的整个宽度 | 试试看 | 按钮组 |
.btn-group-lg |
大型按钮组(使按钮组中的所有按钮更大 - 增加字体大小和填充) | 试试看 | 按钮组 |
.btn-group-sm |
小型按钮组(使按钮组中的所有按钮更小) | 试试看 | 按钮组 |
.btn-group-xs |
超小型按钮组(使按钮组中的所有按钮超小) | 试试看 | 按钮组 |
.btn-group-vertical |
使按钮组垂直堆叠显示 | 试试看 | 按钮组 |
.btn-info |
浅蓝色按钮。表示信息 | 试试看 | 按钮 |
.btn-link |
使按钮看起来像链接(获得按钮行为) | 试试看 | 按钮 |
.btn-lg |
大型按钮 | 试试看 | 按钮 |
.btn-primary |
蓝色按钮。 | 试试看 | 按钮 |
.btn-sm |
小型按钮 | 试试看 | 按钮 |
.btn-success |
绿色按钮。表示成功或积极的行为 | 试试看 | 按钮 |
.btn-warning |
黄色按钮。表示警告或负面行为 | 试试看 | 按钮 |
.btn-xs |
超小型按钮 | 试试看 | 按钮 |
.caption |
在 .thumbnail 中添加标题文本 |
试试看 | 图片 |
.caret |
创建一个尖括号箭头图标 ,它表示按钮是下拉菜单 | 试试看 | 下拉菜单 |
.carousel |
创建一个轮播(幻灯片) | 试试看 | 轮播 |
.carousel-caption |
为轮播中的每个幻灯片创建一个标题文本 | 试试看 | 轮播 |
.carousel-control |
用于“下一个”和“上一个”链接的容器 | 试试看 | 轮播 |
.carousel-indicators |
在每个幻灯片的底部添加小点/指示器(指示轮播中有多少幻灯片,以及用户当前正在查看哪张幻灯片) | 试试看 | 轮播 |
.carousel-inner |
用于幻灯片项目的容器 | 试试看 | 轮播 |
.center-block |
将任何元素居中(将元素设置为 display:block 以及 margin-right:auto 和 margin-left:auto ) |
试试看 | 辅助 |
.checkbox |
用于复选框的容器 | 试试看 | 输入 |
.checkbox-inline |
使多个复选框在同一行上显示 | 试试看 | 输入 |
.clearfix |
清除浮动 | 试试看 | 辅助 |
.close |
表示关闭图标 | 试试看 | 辅助 |
.col-*-* |
响应式网格(跨越 1-12 列)。超小型设备 手机(< 768px)、小型设备 平板电脑(≥768px)、中等设备 台式机(≥992px)、大型设备 台式机(≥1200px)。列值可以是 1-12。 | 试试看 | 网格 |
.col-*-offset-* |
将列向右移动。这些类将列的左外边距增加 * 列 | 试试看 | 网格 |
.col-*-pull-* |
更改网格列的顺序 | 试试看 | 网格 |
.col-*-push-* |
更改网格列的顺序 | 试试看 | 网格 |
.collapse |
表示可折叠内容 - 可以根据需要隐藏或显示 | 试试看 | 折叠 |
.collapse in |
默认显示可折叠内容 | 试试看 | 折叠 |
.container |
固定宽度容器,宽度由屏幕尺寸决定。左右等边距。 | 试试看 | 容器 |
.container-fluid |
跨越屏幕整个宽度的容器 | 试试看 | 容器 |
.control-label |
允许使用标签进行表单验证 | 试试看 | 表单 |
.danger |
为表格行 (<tr> ) 或表格单元格 (<td> ) 添加红色背景。表示危险或潜在的负面行为 |
试试看 | 表格 |
.disabled |
禁用按钮(添加不透明度和“禁止停车标志”图标,悬停时显示) | 试试看 | 按钮 |
.disabled |
禁用下拉菜单项(添加灰色文本颜色和“禁止停车标志”图标,悬停时显示) | 试试看 | 下拉菜单 |
.disabled |
禁用分页链接(无法点击 - 添加灰色文本颜色和“禁止停车标志”图标,悬停时显示) | 试试看 | 分页 |
.disabled |
禁用列表组中的列表项(无法点击 - 添加灰色背景颜色和“禁止停车标志”图标,悬停时显示) | 试试看 | 列表组 |
.divider |
用于用细水平边框分隔下拉菜单中的链接 | 试试看 | 下拉菜单 |
.dl-horizontal |
将 <dl> 元素中的术语 <dt> 和描述 <dd> 并排排列。从默认的 <dl> 开始,但当浏览器窗口展开时,它将并排排列 |
试试看 | 排版 |
.dropdown |
创建一个可切换的菜单,允许用户从预定义列表中选择一个值 | 试试看 | 下拉菜单 |
.dropdown-header |
用于在下拉菜单中添加标题 | 试试看 | 下拉菜单 |
.dropdown-menu |
为下拉菜单容器添加默认样式 | 试试看 | 下拉菜单 |
.dropdown-menu-right |
右对齐下拉菜单 | 试试看 | 下拉菜单 |
.dropdown-toggle |
用于应该隐藏和显示(切换)下拉菜单的按钮 | 试试看 | 下拉菜单 |
.dropup |
表示下拉菜单(向上而不是向下) | 试试看 | 下拉菜单 |
.embed-responsive |
用于嵌入内容的容器。使视频或幻灯片在任何设备上都能正确缩放 | 试试看 | 图片 |
.embed-responsive-16by9 |
用于嵌入内容的容器。创建一个 16:9 的纵横比嵌入内容 | 试试看 | 图片 |
.embed-responsive-4by3 |
用于嵌入内容的容器。创建一个 4:3 的纵横比嵌入内容 | 试试看 | 图片 |
.embed-responsive-item |
用于 .embed-responsive 中。将视频很好地缩放至父元素 |
试试看 | 图片 |
.fade |
在关闭警告框时添加淡出效果 | 试试看 | 警报 |
.form-control |
用于输入、文本区域和选择元素,使它们跨越页面的整个宽度并使其响应式 | 试试看 | 表单 |
.form-control-feedback |
表单验证类 | 试试看 | 输入 2 |
.form-control-static |
在水平表单中,将纯文本添加到表单标签旁边 | 试试看 | 输入 2 |
.form-group |
表单输入和标签的容器 | 试试看 | 表单 |
.form-inline |
使 <form> 左对齐,并带有内联块控件(这仅适用于宽度至少为 768 像素的视窗内的表单) | 试试看 | 表单 |
.form-horizontal |
以水平布局对齐标签和表单控件组 | 试试看 | 表单 |
.glyphicon |
创建图标。Bootstrap 提供了来自 Glyphicons Halflings 集合的 260 个免费字形 | 试试看 | 字形 |
.has-danger |
在标签中添加红色,在输入中添加红色边框,以及在输入中添加错误图标(与 .has-feedback 一起使用) |
试试看 | 表单 |
.has-feedback |
为输入添加反馈图标(勾号、警告和错误符号) | 试试看 | 表单 |
.has-success |
在标签中添加绿色,在输入中添加绿色边框,以及在输入中添加勾号图标(与 .has-feedback 一起使用) |
试试看 | 表单 |
.has-warning |
在标签中添加黄色/橙色,在输入中添加黄色/橙色边框,以及在输入中添加勾号图标(与 .has-feedback 一起使用) |
试试看 | 表单 |
.help-block |
一段帮助文本,换行显示,可能超过一行。 | 试试看 | 输入大小 |
.hidden |
强制隐藏元素 (display:none ) |
试试看 | 辅助 |
.hidden-* |
根据屏幕尺寸隐藏内容 | 试试看 | 辅助 |
.hide |
已弃用。 使用 .hidden 代替 |
试试看 | 辅助 |
.h1 - .h6 |
使元素看起来像所选类的标题 (h1-h6) | 试试看 | 排版 |
.icon-bar |
在导航栏中用于创建汉堡菜单(三个水平条) | 试试看 | 导航栏 |
.icon-next |
Unicode 图标(指向右边的箭头),用于轮播。这通常被替换为字形 | 试试看 | 轮播 |
.icon-prev |
Unicode 图标(指向左边的箭头),用于轮播。这通常被替换为字形 | 试试看 | 轮播 |
.img-circle |
将图像形状为圆形(在 IE8 及更早版本中不受支持) | 试试看 | 图片 |
.img-responsive |
使图像响应式 | 试试看 | 图片 |
.img-rounded |
为图像添加圆角 | 试试看 | 图片 |
.img-thumbnail |
将图像形状为缩略图(边框) | 试试看 | 图片 |
.in |
淡入选项卡 | 试试看 | 选项卡 |
.info |
在表格行 (<tr> ) 或表格单元格 (<td> ) 中添加浅蓝色背景。表示中立的说明性更改或操作 |
试试看 | 表格 |
.initialism |
以稍微更小的字体大小显示 <abbr> 元素内的文本 |
试试看 | 排版 |
.input-group |
容器,通过在输入的前面或后面添加图标、文本或按钮来增强输入,作为“帮助文本” | 试试看 | 输入 |
.input-group-lg |
大型输入组 | 试试看 | 输入 |
.input-group-sm |
小型输入组 | 试试看 | 输入 |
.input-group-addon |
与 .input-group 类一起,此类允许在输入字段旁边添加图标或帮助文本 |
试试看 | 输入 |
.input-group-btn |
与 .input-group 类一起,此类将按钮附加到输入旁边。通常用作搜索栏 |
试试看 | 输入 |
.input-lg |
大型输入字段 | 试试看 | 输入大小 |
.input-sm |
小型输入字段 | 试试看 | 输入大小 |
.invisible |
使元素不可见 (visibility:hidden )。**注意:** 即使元素不可见,它也会在页面上占用空间 |
试试看 | 辅助 |
.item |
添加到每个轮播项的类。可能是文本或图像 | 试试看 | 轮播 |
.jumbotron |
创建一个带圆角的填充灰色框,放大内部文本的字体大小。创建一个大型框,以引起对某些特殊内容或信息的额外关注 | 试试看 | 巨型横幅 |
.label |
为元素添加一个灰色的圆形框。提供有关某事物的附加信息(例如,“新建”) | 试试看 | 标签 |
.label-danger |
红色标签 | 试试看 | 标签 |
.label-info |
浅蓝色标签 | 试试看 | 标签 |
.label-success |
绿色标签 | 试试看 | 标签 |
.label-warning |
黄色标签 | 试试看 | 标签 |
.lead |
增加段落的字体大小和行高 | 试试看 | 排版 |
.left |
用于识别左侧轮播控件 | 试试看 | 轮播 |
.list-group |
为 <li> 元素创建一个带边框的列表组 |
试试看 | 列表组 |
.list-group-item |
添加到列表组中的每个 <li> 元素 |
试试看 | 列表组 |
.list-group-item-heading |
创建一个列表组标题(用于除 <li> 以外的其他元素) |
试试看 | 列表组 |
.list-group-item-text |
用于列表组内的项目文本(用于除 <li> 以外的其他元素) |
试试看 | 列表组 |
.list-group-item-danger |
列表组中列表项的红色背景颜色 | 试试看 | 列表组 |
.list-group-item-info |
列表组中列表项的浅蓝色背景颜色 | 试试看 | 列表组 |
.list-group-item-success |
列表组中列表项的绿色背景颜色 | 试试看 | 列表组 |
.list-group-item-warning |
列表组中列表项的黄色背景颜色 | 试试看 | 列表组 |
.list-inline |
将所有列表项放置在单行上(水平菜单) | 试试看 | 选项卡 |
.list-unstyled |
从 <ul> 或 <ol> 列表中删除所有默认列表样式(项目符号、左边距等) |
试试看 | 排版 |
.mark |
突出显示文本:突出显示的文本 | 试试看 | 排版 |
.media |
对齐媒体对象(如图像或视频 - 通常用于博客文章等中的评论) | 试试看 | 媒体对象 |
.media-body |
应该出现在媒体对象旁边的文本 | 试试看 | 媒体对象 |
.media-heading |
在媒体对象内创建一个标题 | 试试看 | 媒体对象 |
.media-list |
嵌套媒体列表 | 试试看 | 媒体对象 |
.media-object |
表示媒体对象(图像或视频) | 试试看 | 媒体对象 |
.modal |
将内容标识为模态,并将焦点带到它上面 | 试试看 | 模态 |
.modal-body |
定义模态主体样式。在这里添加任何 HTML 标记(p、img 等) | 试试看 | 模态 |
.modal-content |
设置模态样式(边框、背景颜色等)。在里面添加模态的标题、主体和页脚(如果需要) | 试试看 | 模态 |
.modal-dialog |
设置模态的适当宽度和边距 | 试试看 | 模态 |
.modal-footer |
模态的页脚(通常包含操作按钮和关闭按钮) | 试试看 | 模态 |
.modal-header |
模态的标题(通常包含标题和关闭按钮) | 试试看 | 模态 |
.modal-lg |
大型模态(比默认宽度更宽) | 试试看 | 模态 |
.modal-open |
用于 <body> 元素,以防止页面滚动 (overflow:hidden ) |
试试看 | 模态 |
.modal-sm |
小型模态(更窄) | 试试看 | 模态 |
.modal-title |
模态的标题 | 试试看 | 模态 |
.nav nav-tabs |
表示选项卡菜单 | 试试看 | 选项卡 |
.nav nav-pills |
表示药丸菜单 | 试试看 | 选项卡 |
.nav .navbar-nav |
用于包含导航栏内链接的列表项的 <ul> 容器 |
试试看 | 导航栏 |
.nav-justified |
居中选项卡/药丸。注意,在小于 768 像素的屏幕上,项目会堆叠(内容将保持居中) | 试试看 | 选项卡 |
.nav-stacked |
垂直堆叠选项卡或药丸 | 试试看 | 选项卡 |
.nav-tabs |
创建一个选项卡菜单 | 试试看 | 选项卡 |
.navbar |
创建一个导航栏 | 试试看 | 导航栏 |
.navbar-brand |
添加到导航栏内的链接或标题元素中,以表示徽标或标题 | 试试看 | 导航栏 |
.navbar-btn |
在导航栏内垂直对齐按钮 | 试试看 | 导航栏 |
.navbar-collapse |
折叠导航栏(隐藏并用菜单/汉堡图标替换,适用于手机和平板电脑) | 试试看 | 导航栏 |
.navbar-default |
创建一个默认导航栏(浅灰色背景颜色) | 试试看 | 导航栏 |
.navbar-fixed-bottom |
使导航栏停留在屏幕底部(粘性/固定) | 试试看 | 导航栏 |
.navbar-fixed-top |
使导航栏停留在屏幕顶部(粘性/固定) | 试试看 | 导航栏 |
.navbar-form |
添加到导航栏内的表单元素中,以垂直居中它们(适当的填充) | 试试看 | 导航栏 |
.navbar-header |
添加到包含表示徽标或标题的链接/元素的容器元素中 | 试试看 | 导航栏 |
.navbar-inverse |
创建一个黑色导航栏(而不是浅灰色) | 试试看 | 导航栏 |
.navbar-left |
将导航栏中的导航链接、表单、按钮或文本左对齐 | 试试看 | 导航栏 |
.navbar-link |
将元素样式化为导航栏内的链接(锚点获得适当的填充并在悬停时获得下划线,而其他元素(如 p 或 span)则获得默认悬停效果 - 在反转的导航栏中为白色,在默认导航栏中为黑色) | 试试看 | 导航栏 |
.navbar-nav |
用于包含导航栏内链接的列表项的 <ul> 容器 |
试试看 | 导航栏 |
.navbar-right |
将导航栏中的导航链接、表单、按钮或文本右对齐。 | 试试看 | 导航栏 |
.navbar-static-top |
从导航栏中删除左、上和右边框(圆角)(默认导航栏默认情况下带有灰色边框和 4 像素边框半径) | 试试看 | 导航栏 |
.navbar-text |
垂直对齐导航栏内任何不是链接的元素(确保适当的填充) | 试试看 | 导航栏 |
.navbar-toggle |
设置在小屏幕上打开导航栏的按钮的样式。通常与三个 .icon-bar 类一起使用,以指示可切换菜单图标(汉堡包/条形) |
试试看 | 导航栏 |
.next |
在轮播控件中用于识别下一个控件 | 试试看 | 轮播 |
.next |
用于将分页器按钮对齐到页面的右侧(下一个按钮) | 试试看 | 分页器 |
.page-header |
在标题下方添加一条水平线(+ 在元素周围添加一些额外的空间) | 试试看 | 页面标题 |
.pager |
创建上一个/下一个按钮(用于 <ul> 元素) |
试试看 | 分页器 |
.pagination |
创建一个分页(在你的网站有很多页面时很有用。用于 <ul> 元素) |
试试看 | 分页 |
.pagination-lg |
大型分页(每个分页链接的字体大小为 18 像素。默认值为 14 像素) | 试试看 | 分页 |
.pagination-sm |
小型分页(每个分页链接的字体大小为 12 像素。默认值为 14 像素) | 试试看 | 分页 |
.panel |
创建一个带边框的框,在其内容周围有一些填充 | 试试看 | 面板 |
.panel-body |
面板内内容的容器 | 试试看 | 面板 |
.panel-collapse |
可折叠面板(在隐藏和显示面板之间切换) | 试试看 | 折叠 |
.panel-danger |
红色面板。表示危险 | 试试看 | 面板 |
.panel-info |
浅蓝色面板。表示信息 | 试试看 | 面板 |
.panel-success |
绿色面板。表示成功 | 试试看 | 面板 |
.panel-warning |
黄色面板。表示警告 | 试试看 | 面板 |
.panel-footer |
创建一个面板页脚(浅色背景) | 试试看 | 面板 |
.panel-group |
用于将多个面板分组在一起。这会删除每个面板下方的底部边距 | 试试看 | 面板 |
.panel-heading |
创建一个面板标题(浅色背景) | 试试看 | 面板 |
.panel-title |
用于 .panel-heading 内部,以调整文本样式(删除边距并添加 16 像素的字体大小) |
试试看 | 面板 |
.popover |
弹出框,当用户点击某个元素时出现 | 试试看 | 弹出框 |
.pre-scrollable |
使 <pre> 元素可滚动 (max-height 为 350 像素,并提供 y 轴滚动条) |
试试看 | 辅助 |
.prev |
在轮播中用于指示“上一个”链接 | 试试看 | 轮播 |
.previous |
用于将分页器按钮对齐到页面的左侧(上一个按钮) | 试试看 | 分页器 |
.progress |
进度条的容器 | 试试看 | 进度条 |
.progress-bar |
创建一个进度条 | 试试看 | 进度条 |
.progress-bar-danger |
红色进度条。表示危险 | 试试看 | 进度条 |
.progress-bar-info |
浅蓝色进度条。表示信息 | 试试看 | 进度条 |
.progress-bar-striped |
创建一个条纹进度条 | 试试看 | 进度条 |
.progress-bar-success |
绿色进度条。表示成功 | 试试看 | 进度条 |
.progress-bar-warning |
黄色进度条。指示警告 | 试试看 | 进度条 |
.pull-left |
将元素浮动到左侧 | 试试看 | 辅助 |
.pull-right |
将元素浮动到右侧 | 试试看 | 辅助 |
.right |
用于标识右侧轮播控件 | 试试看 | 轮播 |
.row |
响应式列的容器 | 试试看 | 网格 |
.row-no-gutters |
从行及其列中删除间隙 | 试试看 | 网格 |
.show |
显示元素 (display:block) |
试试看 | 辅助 |
.small |
在任何标题中创建较浅的辅助文本 | 试试看 | 排版 |
.sr-only |
隐藏除屏幕阅读器之外所有设备上的元素 | 试试看 | 辅助 |
.sr-only-focusable |
隐藏除屏幕阅读器之外所有设备上的元素 | 试试看 | 辅助 |
.success |
为表格行 (<tr> ) 或表格单元格 (<td> ) 添加绿色背景色。指示成功或积极操作 |
试试看 | 表格 |
.tab-content |
与 .tab-pane 一起使用以创建可切换/动态标签/药丸 |
试试看 | 选项卡 |
.tab-pane |
与 .tab-content 一起使用以创建可切换/动态标签/药丸 |
试试看 | 选项卡 |
.table |
为表格添加基本样式(填充、底部边框等) | 试试看 | 表格 |
.table-bordered |
在表格和单元格的所有边框上添加边框 | 试试看 | 表格 |
.table-condensed |
通过将单元格填充减半使表格更紧凑 | 试试看 | 表格 |
.table-hover |
创建可悬停表格(在悬停表格行时添加灰色背景色) | 试试看 | 表格 |
.table-responsive |
使表格响应式(在需要时添加水平滚动条) | 试试看 | 表格 |
.text-capitalize |
指示大写文本 | 试试看 | 排版 |
.text-center |
居中对齐文本 | 试试看 | 排版 |
.text-danger |
红色文本颜色。指示危险 | 试试看 | 排版 |
.text-hide |
隐藏文本(有助于用背景图像替换元素的文本内容) | 试试看 | 排版 |
.text-info |
浅蓝色文本颜色。指示信息 | 试试看 | 排版 |
.text-justify |
指示对齐文本 | 试试看 | 排版 |
.text-left |
将文本对齐到左侧 | 试试看 | 排版 |
.text-lowercase |
将文本更改为小写 | 试试看 | 排版 |
.text-muted |
灰色文本颜色 | 试试看 | 排版 |
.text-nowrap |
防止文本换行 | 试试看 | 排版 |
.text-primary |
蓝色文本颜色 | 试试看 | 排版 |
.text-right |
将文本对齐到右侧 | 试试看 | 排版 |
.text-success |
绿色文本颜色。指示成功 | 试试看 | 排版 |
.text-uppercase |
使文本大写 | 试试看 | 排版 |
.text-warning |
黄色/橙色文本颜色。指示警告 | 试试看 | 排版 |
.thumbnail |
在元素(通常是图像或视频)周围添加边框,使其看起来像缩略图 | 试试看 | 图片 |
.tooltip |
弹出框,当用户将鼠标指针移到元素上时出现 | 试试看 | 工具提示 |
.visible-* |
自 v3.2.0 起已弃用。 用于根据设备显示和/或隐藏内容。注意:使用 .hidden-* 替换 |
试试看 | 辅助 |
.visible-print-block |
在打印(预览)中显示元素 (display:block ) |
辅助 | |
.visible-print-inline |
在打印(预览)中显示元素 (display:inline ) |
辅助 | |
.visible-print-inline-block |
在打印(预览)中显示元素 (display:inline-block ) |
辅助 | |
.hidden-print |
在打印(预览)中隐藏元素 (display:none ) |
辅助 | |
.warning |
为表格行 (<tr> ) 或表格单元格 (<td> ) 添加黄色背景色。指示警告 |
试试看 | 表格 |
.well |
在元素周围添加圆角边框,并带有灰色背景色和一些填充 | 试试看 | 井 |
.well-lg |
大型井(更多填充) | 试试看 | 井 |
.well-sm |
小型井(更少填充) | 试试看 | 井 |
上表显示了所有可用的 Bootstrap 3 类。
提示:要查看所有 Bootstrap 4 类的完整列表,请访问我们的 所有 Bootstrap 4 CSS 类参考。