Comment centrer la barre de navigation bootstrap

Quand j'ai utilisé Bootstrap pour m'entraîner à imiter un site Web aujourd'hui, j'ai trouvé que le menu dans la barre de navigation du site cible était centré, mais Bootstrap ne semble pas avoir de style centré pour le menu de navigation. Cela m'a pris beaucoup de temps. du temps et de nombreux tests pour enfin trouver une solution.

La première méthode : ajoutez les styles suivants à div et ul : (apprentissage recommandé : Tutoriel vidéo Bootstrap )

<div class="navbar-collapse collapse" style="text-align: center;">
  <ul class="nav navbar-nav" style="display: inline-block;float: none;">
    <li class="">
        <a href="#">首页</a>
    </li>
    <li class="">
        <a href="#">加入我们</a>
    </li>
    <li class="">
        <a href="#">联系我们</a>
    </li>
  </ul>
</div>

La deuxième méthode :

<div class="navbar-collapse collapse">
  <ul class="nav navbar-nav">
    <li class="">
        <a href="#">首页</a>
    </li>
    <li class="">
        <a href="#">加入我们</a>
    </li>
    <li class="">
        <a href="#">联系我们</a>
    </li>
  </ul>
</div>

Ajoutez le style suivant :

.navbar-nav {
  float: none;
  text-align:center;
}
ul.nav.navbar-nav  li {
    float:none;
    display: inline-block;
    margin: 0em;
}

Plus d'articles techniques liés à Bootstrap, s'il vous plaît visitez la colonne Tutoriel Bootstrap pour apprendre !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!