Bootstrap 5 TutorialLesson 17Free preview

BS5 Pagination

This lesson is part of Bootstrap · All levels

Summary

Pagination displays a sequence of page numbers so that users can move content gradually. Bootstrap structures use <ul class="pagination"> containing <li class="page-item"> with <a class="page-link"> in it. The .pagination-sm variants make it more concise, while the .active and .disabled classes mark the page status.

Key points

Structure: then P1, then P2.
.page-link gives the page link style.
.active marks the page is being opened; .disabled disables the item.
It makes the size smaller. (.pagination-sm)
Previous and Next text are written as the contents of the link.

Full lesson

Code examples and quizzes

Full lessons, code examples, and quizzes are available to subscribers. 5 questions.