Bootstrap: Pagination

Basic Example

Provide pagination links for your site or app with the multi-page pagination component, or the simpler pager alternative.

<Pagination>
  <Page begin disabled />
  <Page active href='#'>2</Page>
  <Page href='#'>2</Page>
  <Page href='#'>3</Page>
  <Page href='#'>4</Page>
  <Page href='#'>5</Page>
  <Page end />
</Pagination>

Sizing

Fancy larger or smaller pagination? Add lg or sm for additional sizes.

<Pagination lg>
  ...
</Pagination>
<Pagination>
  ...
</Pagination>
<Pagination sm>
  ...
</Pagination>

Pager

Quick previous and next links for simple pagination implementations with light markup and styles. It's great for simple sites like blogs or magazines.

<Pager>
  <Page href='#'>Previous</Page>{' '}
  <Page href='#'>Next</Page>
</Pager>

Aligned links

Alternatively, you can align each link to the sides (with optional disabled state).

<Pager>
  <Page previous disabled href='#'>Previous</Page>{' '}
  <Page next href='#'>Next</Page>
</Pager>