Bootstrap4 列表组

2020-06-19 08:31:33易采站长站整理

Bootstrap4 列表组

大部分基础列表组都是无序的。

要创建列表组,可以在

元素上添加 .list-group 类, 在

元素上添加 .list-group-item 类:

实例

First itemSecond itemThird item


激活状态的列表项

通过添加 .active 类来设置激活状态的列表项:

实例

Active itemSecond itemThird item


禁用的列表项

.disabled 类用于设置禁用的列表项:

实例

Disabled itemSecond itemThird item


链接列表项

要创建一个链接的列表项,可以将

替换为

, 替换

。如果你想鼠标悬停显示灰色背景就添加.list-group-item-action 类:

实例

First item
Second item
Third item


多种颜色列表项

列表项目的颜色可以通过以下列来设置:
.list-group-item-success, list-group-item-secondary, list-group-item-info,
list-group-item-warning, .list-group-item-danger, list-group-item-dark 和 list-group-item-light:

实例

成功列表项次要列表项信息列表项警告列表项危险列表项主要列表项深灰色列表项浅色列表项

链接的多种颜色列表项

实例

激活列表项
成功列表项
次要列表项
信息列表项
警告列表项
危险列表项
主要列表项
深灰色列表项
浅色列表项

相关文章 大家在看