Como fazer paginação com Bootstrap?
Paginação Bootstrap
Para fazer isso é usado a classe pagination do bootstrap.
A lista de páginas usadas será:
primeira<
3
4
5
>
última
Sendo página atual a 4, o sinal de maior usado para a página seguinte, o sinal de menor usado para a página anterior, "última" como a página final que será a 8 e "primeira" para a inícial.
No exemplo abaixo é mostrada a paginação simples, com a página atual em destaque e sem possibilidade de ser clicada.
<ul class="pagination">
<li class="page-item"><a class="page-link" href="#1">primeira</a></li>
<li class="page-item"><a class="page-link" href="#3"><</a></li>
<li class="page-item"><a class="page-link" href="#3">3</a></li>
<li class="page-item active disabled"><a class="page-link" href="#4">4</a></li>
<li class="page-item"><a class="page-link" href="#5">5</a></li>
<li class="page-item"><a class="page-link" href="#6">></a></li>
<li class="page-item"><a class="page-link" href="#8">última</a></li>
</ul>
</nav>
O aria-label é necessário para usar mais um bloco de paginação na página.
O active é usado para mudar o estilo da página atual.
Se a página atual fosse a 8 poderia ser usado a classe disabled para inativar o clique no link última e próximo. O mesmo poderia ser feito quanto estivesse na primeira. Ficando assim:
<li class="page-item disabled"><a class="page-link" href="#8">última</a></li>
Para definir o tamanho dos botões pode se usar a classe de pagination seguida do tamanho que pode ser lg para grande e sm para pequeno. Ficando assim:
Para alinhar o bloco de botões pode ser usado a classe de alinhamento junto a classe pagination.
Algo como:
Como fazer paginação com php e mysql?
Como fazer leiaute de paginação com CSS?
O que é paginação de um site?
O que é Bootstrap?
Leia mais em: t.wikipedia.org/wiki/Bootstra...
