onglet Fondation
Si vous avez beaucoup de pages de contenu, vous devez utiliser la fonction de recherche de personnes.
Pour créer une caractéristique de base de pagination nécessite <ul> sur l'élément , plus .pagination catégories:
Exemples
<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>
Essayez »
La page en cours
Vous pouvez <li> ajouté .current classe pour marquer la page en cours:
Exemples
<Li class = "courant"> <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>
Essayez »
onglet Désactiver
Si vous avez besoin de mettre en place un onglet vous pas cliquable besoin .unavailable catégories:
Exemples
<Li> <a href = "#"> 1 </ a> </ li>
<Li> <a href = "#"> 2 </ a> </ li>
<Li class = "indisponible"> <a href = "#"> 3 </ a> </ li>
<Li> <a href = "#"> 4 </ a> </ li>
<Li> <a href = "#"> 5 </ a> </ li>
</ Ul>
Essayez »
direction Paging
Dans le premier et le dernier code> <li> Ajoutez l'élément .arrow entités insert de classe HTML Symbole « et » pour créer un symbole de direction de pagination:
Exemples
<Li class = "flèche"> <a href = "#"> & laquo; </ a> </ li>
<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>
<Li class = "flèche"> <a href = "#"> & raquo; </ a> </ li>
</ Ul>
Paging centrée
Nous pouvons ajouter le <ul> externe <div> élément et <div> Ajouter sur .pagination-centered sur les classes pour mettre en œuvre la pagination centrée:
Exemples
<Class Ul = "pagination">
<Li class = "flèche"> <a href = "#"> & laquo; </ a> </ li>
<Li class = "courant"> <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>
<Li class = "flèche"> <a href = "#"> & raquo; </ a> </ li>
</ Ul>
</ Div>
Essayez »
Breadcrumbs
la structure Breadcrumbs de navigation utilisé pour afficher la page en cours.
Dans le <ul> sur l'élément ajouté .breadcrumbs classe pour implémenter la chapelure. Vous pouvez ajouter <li> sur .current ou .unavailable classe mis la page en cours et l' effet pas cliquable:
Exemples
<Li> <a href = "#"> Accueil </ a> </ li>
<Li> <a href = "#"> privé </ a> </ li>
<Class = Li "indisponible"> <a href = "#"> Photos </ a> </ li>
<Class = Li "courant"> vacances </ li>
</ Ul>
Essayez »
Sous-navigation
Activation de la page, la sous-navigation est très utile.
Dans la <dl> l'élément est ajouté .sub-nav classe pour créer un sous-navigation. Dans le <dt> sur l'élément à ajouter un titre pour l'option sélectionnée <dd> Ajouter .active catégories:
Exemples
<Dt> Filtre: </ dt >
<Class Dd = "active"> <a href = "#"> Tous </ a> </ dd>
<Dd> <a href = "#"> Actif </ a> </ dd>
<Dd> <a href = "#"> attente </ a> </ dd>
<Dd> <a href = "#"> suspendu </ a> </ dd>
</ Ul>
Essayez »