v2.1.0

Pagination

  • Basic

    Basic

    <ul class="pagination">
      <li><a href="#">Previous</a></li>
      <li><a href="#">1</a></li>
      <li><a href="#" class="active">2</a></li>
      <li><a href="#">3</a></li>
      <li><a href="#">4</a></li>
      <li><a href="#">5</a></li>
      <li><a href="#">6</a></li>
      <li><a href="#">Next</a></li>
    </ul>
    

    Disabled

    <ul class="pagination">
      <li><a href="#" class="disabled">Previous</a></li>
      <li><a href="#">1</a></li>
      <li><a href="#" class="active">2</a></li>
      <li><a href="#">3</a></li>
      <li><a href="#">4</a></li>
      <li><a href="#">5</a></li>
      <li><a href="#">6</a></li>
      <li><a href="#">Next</a></li>
    </ul>
    
  • Icon
    <ul class="pagination">
      <li>
        <a href="#"><span class="fas fa-angle-double-left"></span></a>
      </li>
      <li><a href="#">1</a></li>
      <li><a href="#" class="active">2</a></li>
      <li><a href="#">3</a></li>
      <li><a href="#">4</a></li>
      <li><a href="#">5</a></li>
      <li><a href="#">6</a></li>
      <li>
        <a href="#"><span class="fas fa-angle-double-right"></span></a>
      </li>
    </ul>
    
  • Round

    Round

    <ul class="pagination-round">
      <li>
        <a href="#"><span class="fas fa-angle-double-left"></span></a>
      </li>
      <li><a href="#">1</a></li>
      <li><a href="#" class="active">2</a></li>
      <li><a href="#">3</a></li>
      <li><a href="#">4</a></li>
      <li><a href="#">5</a></li>
      <li><a href="#">6</a></li>
      <li>
        <a href="#"><span class="fas fa-angle-double-right"></span></a>
      </li>
    </ul>