如何增加导航药丸引导程序之间的空间？答案

【问题标题】：how to increase space between nav-pills bootsrap?如何增加导航药丸引导程序之间的空间？
【发布时间】：2014-11-08 21:15:59
【问题描述】：

我的导航药丸要关闭，我希望它们散开，有什么方法可以更改字体和字体大小？

 <div id = "page">
       <ul class="nav nav-pills" role="tablist">
      <li role="presentation" class="active"><a href="#">Home</a></li>
      <li role="presentation"><a href="#">Profile</a></li>
      <li role="presentation"><a href="#">Messages</a></li>
      <li role="presentation"><a href="#">Profile</a></li>
      <li role="presentation"><a href="#">Messages</a></li>
    </ul>

   <div>

【问题讨论】：

这会起作用：.nav-pills > li > a {margin-left:??px;margin-right:??px;}
效果很好，谢谢！

标签： html css twitter-bootstrap web navbar

【解决方案1】：

您可以像这样自定义每个 li 之间的边距：

.nav-pills>li+li {
  margin-left: 10px; // 2px by default
}

【讨论】：

【解决方案2】：

只需创建新的 CSS 文件并将其链接到您的 HTML 中。然后在里面写下这段代码：

.nav-pills li {
    margin-left: 5px; //use whatever you want
} 

.nav-pills a {
    //use font-family and font-size to change font and size of it.
}

只记得在引导后链接这个新的 css 文件，这样它就会覆盖它。

【讨论】：

【解决方案3】：

这样就可以了，只需替换 ??与您选择的号码。

.nav-pills > li > a { margin-left:??px;margin-right:??px; }

【讨论】：