List group – Basic list groups
From Bootstrap - Demo Wiki
Component | ||
---|---|---|
Name | List group | |
Description | Basic list groups | |
Provider | Skin | |
Reference | getbootstrap.com - list group | |
Styling | For all possible color styles and corresponding examples, see colors. |
Basic
- Code
<ul class="list-group">
<li class="list-group-item">An item</li>
<li class="list-group-item">A second item</li>
<li class="list-group-item">A third item</li>
<li class="list-group-item">A fourth item</li>
<li class="list-group-item">And a fifth one</li>
</ul>
- Result
- An item
- A second item
- A third item
- A fourth item
- And a fifth one
Active item
- Code
<ul class="list-group">
<li class="list-group-item">An item</li>
<li class="list-group-item active" aria-current="true">An active item</li>
<li class="list-group-item">A third item</li>
<li class="list-group-item">A fourth item</li>
<li class="list-group-item">And a fifth one</li>
</ul>
- Result
- An item
- An active item
- A third item
- A fourth item
- And a fifth one
Disabled item
- Code
<ul class="list-group">
<li class="list-group-item disabled" aria-disabled="true">A disabled item</li>
<li class="list-group-item">A second item</li>
<li class="list-group-item">A third item</li>
<li class="list-group-item">A fourth item</li>
<li class="list-group-item">And a fifth one</li>
</ul>
- Result
- A disabled item
- A second item
- A third item
- A fourth item
- And a fifth one