Sommaire

Les liens inactifs dans les onglets COMPOSANTS DE NAVIGATION ET DE PAGINATION:Liens inactifs dans les onglets

Dans votre barre de navigation, vous pouvez afficher de manière particulière les liens inactifs.

Pour afficher des liens inactifs, utilisez la classe .disabled dans le <li> correspondant.

Voici le code à utiliser :

<ul class="nav nav-tabs"> 
   <li class="active"><a href="#">Accueil</a></li> 
   <li class="disabled"><a href="#">Projet</a></li> 
   <li><a href="#">Equipe</a></li> 
</ul>

Voici l’affichage :

images/C12-005.png

Vous constatez que seule la mise en forme de l’élément <li> est modifiée.

Voici le sélecteur où intervient la classe .disabled :

.nav > li.disabled > a:hover, .nav > li.disabled > a:focus { 
   color: #999; 
   text-decoration: none; 
   cursor: not-allowed; 
   background-color: transparent; 
}

Cet exemple est disponible dans le fichier Bootstrap-06-COMP-Nav-Pag/01-Navigation-tab.html.