BS Pagination
Basic Pagination
If your website has a large number of pages, you may want to add pagination to each one.
A basic Bootstrap pagination looks like this:
------Button mukava -----
To make a basic pagination, add the .pagination class to a <ul> element.
Example
<ul class="pagination">
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
</ul>
Active State
The active status displays what is the current page:
----- Button mukava ------
Add class .active to let the user know which page he or she is on.
Example
<ul class="pagination">
<li><a href="#">1</a></li>
<li class="active"><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
</ul>
Disabled State
A disabled link can’t be clicked.
----- Button mukava ------
If a link is disabled for whatever reason, add the class .disabled:
Example
<ul class="pagination">
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li class="disabled"><a href="#">4</a></li>
<li><a href="#">5</a></li>
</ul>
Pagination Sizing
Pagination blocks can be sized to a larger or smaller size:
----- Button mukava ------
Add the class .pagination-lg for larger blocks or .pagination-sm for smaller ones.
Example
<ul class="pagination pagination-lg">
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
</ul>
<ul class="pagination pagination-sm">
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
</ul>
Breadcrumbs
Breadcrumbs are another form of pagination.
----- Button mukava ------
The .breadcrumb class identifies the current page’s position within a navigational hierarchy:
Example
<ul class="breadcrumb">
<li><a href="#">Home</a></li>
<li><a href="#">Private</a></li>
<li><a href="#">Pictures</a></li>
<li class="active">Vacation</li>
</ul>
