boostrap pagination code example

Example 1: bootstrap pagination

<nav aria-label="Page navigation example">
  <ul class="pagination">
    <li class="page-item"><a class="page-link" href="#">Previous</a></li>
    <li class="page-item"><a class="page-link" href="#">1</a></li>
    <li class="page-item"><a class="page-link" href="#">2</a></li>
    <li class="page-item"><a class="page-link" href="#">3</a></li>
    <li class="page-item"><a class="page-link" href="#">Next</a></li>
  </ul>
</nav>

Example 2: bootstrap pagination

<!-- Bootstrap 5 Pagination -->
<nav aria-label="Page navigation example">
   <ul class="pagination">
      <li class="page-item"><a class="page-link" href="#">Previous</a></li>
      <li class="page-item"><a class="page-link" href="#">1</a></li>
      <li class="page-item"><a class="page-link" href="#">2</a></li>
      <li class="page-item"><a class="page-link" href="#">3</a></li>
      <li class="page-item"><a class="page-link" href="#">Next</a></li>
   </ul>
</nav>

Example 3: bootstrap 4 pagination center

Use the class .justify-content-center on the .pagination ul.

e.g. <ul class="pagination justify-content-center">

Tags:

Html Example