Spectre Pagination

Spectre Pagination is used to create a pagination, it's basically is used to enable navigation between pages in a website. The pagination used in spectre has a large block of connected links that are hard to miss and are easily scalable.

To create a pagination you need to add a container element with the pagination class. And add child elements with the page-item class. The page-item with the active class will be highlighted. You can add the disabled class to the page-item to have unclickable page links. 

Spectre Pagination Class:

• pagination: This class is used to create pagination.
• page-item: This class is used to set the numbers or page item of pagination.

Note: The active and disabled class can be used to make the page-item active and disabled.

Syntax:

<ul class="pagination">
 <li class="page-item disabled">
 <a href="#">...</a>
 </li>
 <li class="page-item active">
 <a href="#">...</a>
 </li>
</ul>

Below examples illustrate Spectre Pagination:

Example 1:

Output:

👁 Spectre Pagination

Example 2:

Output:

👁 Spectre Pagination

Reference: https://picturepan2.github.io/spectre/components/pagination.html