Basic example
The list groups are very useful and flexible component for displaying lists of elements in a beautiful manner.
The most basic list group is an unordered list with list items and the proper classes. Build upon it with the options that follow.
- An item
- A second item
- A third item
- A fourth item
- And a fifth one
Active items
Use code below to indicate the current active selection.
- An item
- A second item
- A third item
- A fourth item
- And a fifth one
Disabled items
The class .text-neutral-*
and .cursor-default
is
used to disable a specific item in the list group.
- A disabled item
- A second item
- A third item
- A fourth item
- And a fifth one
Links
Use <a>
or <button>
to create
actionable list group items with hover, disabled, and active states.
Buttons
Use <a>
or <button>
to create
actionable list group items with hover, disabled, and active states.
If you are looking for more advanced options, try Bootstrap Images from MDBootstrap.