La pagination permet à l’utilisateur de naviguer entre les différentes pages d’une liste d'éléments.
Documentation<nav role="navigation" class="fr-pagination" aria-label="Pagination">
<ul class="fr-pagination__list">
<li>
<a class="fr-pagination__link fr-pagination__link--prev" id="pagination__link-5385" href="#">
Page précédente
</a>
</li>
</ul>
</nav>
<nav role="navigation" class="fr-pagination" aria-label="Pagination">
<ul class="fr-pagination__list">
<li>
<a class="fr-pagination__link fr-pagination__link--prev fr-pagination__link--label" id="pagination__link-5388" href="#">
Page précédente
</a>
</li>
</ul>
</nav>
<nav role="navigation" class="fr-pagination" aria-label="Pagination">
<ul class="fr-pagination__list">
<li>
<a class="fr-pagination__link fr-pagination__link--prev fr-pagination__link--lg-label" id="pagination__link-5391" href="#">
Page précédente
</a>
</li>
</ul>
</nav>
<nav role="navigation" class="fr-pagination" aria-label="Pagination" data-fr-analytics-page-total="132">
<ul class="fr-pagination__list">
<li>
<a class="fr-pagination__link fr-pagination__link--first" id="pagination__link-5404" aria-disabled="true" role="link">
Première page
</a>
</li>
<li>
<a class="fr-pagination__link fr-pagination__link--prev fr-pagination__link--lg-label" id="pagination__link-5405" aria-disabled="true" role="link">
Page précédente
</a>
</li>
<li>
<a class="fr-pagination__link" id="pagination__link-5406" aria-current="page" title="Page 1">
1
</a>
</li>
<li>
<a class="fr-pagination__link" id="pagination__link-5407" href="#" title="Page 2">
2
</a>
</li>
<li>
<a class="fr-pagination__link fr-hidden fr-unhidden-lg" id="pagination__link-5408" href="#" title="Page 3">
3
</a>
</li>
<li>
<a class="fr-pagination__link fr-hidden fr-unhidden-lg" id="pagination__link-5409">
…
</a>
</li>
<li>
<a class="fr-pagination__link fr-hidden fr-unhidden-lg" id="pagination__link-5410" href="#" title="Page 130">
130
</a>
</li>
<li>
<a class="fr-pagination__link fr-hidden fr-unhidden-lg" id="pagination__link-5411" href="#" title="Page 131">
131
</a>
</li>
<li>
<a class="fr-pagination__link" id="pagination__link-5412" href="#" title="Page 132">
132
</a>
</li>
<li>
<a class="fr-pagination__link fr-pagination__link--next fr-pagination__link--lg-label" id="pagination__link-5413" href="#">
Page suivante
</a>
</li>
<li>
<a class="fr-pagination__link fr-pagination__link--last" id="pagination__link-5414" href="#">
Dernière page
</a>
</li>
</ul>
</nav>
<nav role="navigation" class="fr-pagination" aria-label="Pagination" data-fr-analytics-page-total="132">
<ul class="fr-pagination__list">
<li>
<a class="fr-pagination__link fr-pagination__link--first" id="pagination__link-5427" href="#">
Première page
</a>
</li>
<li>
<a class="fr-pagination__link fr-pagination__link--prev fr-pagination__link--lg-label" id="pagination__link-5428" href="#">
Page précédente
</a>
</li>
<li>
<a class="fr-pagination__link" id="pagination__link-5429" href="#" title="Page 1">
1
</a>
</li>
<li>
<a class="fr-pagination__link" id="pagination__link-5430" aria-current="page" title="Page 2">
2
</a>
</li>
<li>
<a class="fr-pagination__link fr-hidden fr-unhidden-lg" id="pagination__link-5431" href="#" title="Page 3">
3
</a>
</li>
<li>
<a class="fr-pagination__link fr-hidden fr-unhidden-lg" id="pagination__link-5432">
…
</a>
</li>
<li>
<a class="fr-pagination__link fr-hidden fr-unhidden-lg" id="pagination__link-5433" href="#" title="Page 130">
130
</a>
</li>
<li>
<a class="fr-pagination__link fr-hidden fr-unhidden-lg" id="pagination__link-5434" href="#" title="Page 131">
131
</a>
</li>
<li>
<a class="fr-pagination__link" id="pagination__link-5435" href="#" title="Page 132">
132
</a>
</li>
<li>
<a class="fr-pagination__link fr-pagination__link--next fr-pagination__link--lg-label" id="pagination__link-5436" href="#">
Page suivante
</a>
</li>
<li>
<a class="fr-pagination__link fr-pagination__link--last" id="pagination__link-5437" href="#">
Dernière page
</a>
</li>
</ul>
</nav>
<nav role="navigation" class="fr-pagination" aria-label="Pagination" data-fr-analytics-page-total="132">
<ul class="fr-pagination__list">
<li>
<a class="fr-pagination__link fr-pagination__link--first" id="pagination__link-5450" href="#">
Première page
</a>
</li>
<li>
<a class="fr-pagination__link fr-pagination__link--prev fr-pagination__link--lg-label" id="pagination__link-5451" href="#">
Page précédente
</a>
</li>
<li>
<a class="fr-pagination__link" id="pagination__link-5452" href="#" title="Page 1">
1
</a>
</li>
<li>
<a class="fr-pagination__link" id="pagination__link-5453" href="#" title="Page 2">
2
</a>
</li>
<li>
<a class="fr-pagination__link fr-hidden fr-unhidden-lg" id="pagination__link-5454" href="#" title="Page 3">
3
</a>
</li>
<li>
<a class="fr-pagination__link fr-hidden fr-unhidden-lg" id="pagination__link-5455">
…
</a>
</li>
<li>
<a class="fr-pagination__link fr-hidden fr-unhidden-lg" id="pagination__link-5456" href="#" title="Page 130">
130
</a>
</li>
<li>
<a class="fr-pagination__link fr-hidden fr-unhidden-lg" id="pagination__link-5457" href="#" title="Page 131">
131
</a>
</li>
<li>
<a class="fr-pagination__link" id="pagination__link-5458" aria-current="page" title="Page 132">
132
</a>
</li>
<li>
<a class="fr-pagination__link fr-pagination__link--next fr-pagination__link--lg-label" id="pagination__link-5459" aria-disabled="true" role="link">
Page suivante
</a>
</li>
<li>
<a class="fr-pagination__link fr-pagination__link--last" id="pagination__link-5460" aria-disabled="true" role="link">
Dernière page
</a>
</li>
</ul>
</nav>