Bootstrap Pagination

Pagination is useful for navigating multi-page content.

Basic Pagination

<ul class="pagination">
  <li><a href="#">1</a></li>
  <li><a href="#">2</a></li>
  <li><a href="#">3</a></li>
</ul>

Output:

Important Note: Pagination helps improve user experience by organizing content into multiple pages.

Active and Disabled States

Example for Active state:

<ul class="pagination">
  <li class="active"><a href="#">1</a></li>
  <li><a href="#">2</a></li>
  <li><a href="#">3</a></li>
</ul>

Output:

Example for Disabled state:

<ul class="pagination">
  <li><a href="#">1</a></li>
  <li><a href="#">2</a></li>
  <li class="disabled"><a href="#">3</a></li>
</ul>

  document.addEventListener("DOMContentLoaded", function() {
    const faqQuestions = document.querySelectorAll(".faq-question");
    faqQuestions.forEach(button => {
      button.addEventListener("click", function() {
        const answer = this.nextElementSibling;
        const isVisible = answer.style.display === "block";
        answer.style.display = isVisible ? "none" : "block";
      });
    });
  });

Request more information

Bootstrap Pagination