Bootstrap -paginering

Basis paginering

Als u een website heeft met veel pagina's, wilt u misschien een soort paginering aan elke pagina toevoegen.

Een eenvoudige paginering in Bootstrap ziet er als volgt uit:

• 1
• 2
• 3
• 4
• 5

Om een ​​basispaginering te maken, voegt u de .paginationklasse toe aan een <ul>element:

Actieve staat

De actieve status laat zien wat de huidige pagina is:

• 1
• 2
• 3
• 4
• 5

Class toevoegen .activeom de gebruiker te laten weten op welke pagina hij/zij zich bevindt:

Uitgeschakelde staat

Er kan niet op een uitgeschakelde link worden geklikt:

• 1
• 2
• 3
• 4
• 5

Klasse toevoegen .disabledals een link om de een of andere reden is uitgeschakeld:

Grootte van paginering

Pagineringsblokken kunnen ook groter of kleiner worden gemaakt:

• 1
• 2
• 3
• 4
• 5

• 1
• 2
• 3
• 4
• 5

Voeg klasse toe .pagination-lgvoor grotere blokken of .pagination-smvoor kleinere blokken:

Paneermeel

Een andere vorm voor paginering is breadcrumbs:

1. Huis
2. Privaat
3. Afbeeldingen
4. Vakantie

De .breadcrumbklasse geeft de locatie van de huidige pagina aan binnen een navigatiehiërarchie:

<ul class="">
  <li><a href="#">1</a></li>
  <li><a href="#">2</a></li>
  <li><a href="#">3</a></li>
  <li><a href="#">4</a></li>
  <li><a href="#">5</a></li>
</ul>

Volledige Bootstrap-navigatiereferentie

Ga voor een volledige referentie van alle navigatieklassen naar onze volledige Bootstrap-navigatiereferentie .