Pagination

Hi, Admin 先生/小姐

範例 1

分頁

置左

< nav aria-label="Page navigation">
  < ul class="pagination> 
    < li class="page-item disabled">< a class="page-link" href="#" tabindex="-1" aria-disabled="true">Previous< /a>< /li> 
    < li class="page-item active">< 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>

範例 2

分頁

置中

< div class="col-12 center">
 < nav aria-label="Page navigation">
  < ul class="pagination> 
    < li class="page-item disabled">< a class="page-link" href="#" tabindex="-1" aria-disabled="true">Previous< /a>< /li> 
    < li class="page-item active">< 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>
< /div>

範例 3

分頁

置右

< div class="col-12 d-flex justify-content-end">
 < nav aria-label="Page navigation">
  < ul class="pagination> 
    < li class="page-item disabled">< a class="page-link" href="#" tabindex="-1" aria-disabled="true">Previous< /a>< /li> 
    < li class="page-item active">< 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>
< /div>