更改Bootstrap Nav-Pills的宽度和外观

Question

我用nav-pills设置了导航栏。我有水平和对齐的条，所以他们都很好地对齐，但我想改变导航药丸的宽度，以便我可以使它们与网站上的其他所有东西更均匀。下面是我的导航栏代码：

<div class="container" id="buttonBar">
<ul class="nav nav-pills nav-justified">
  <li class="active"><a href="index.html">HOME</a></li>
  <li><a href="about.html">ABOUT</a></li>
  <li><a href="video.html">VIDEO</a></li>
  <li><a href="photo.html">PHOTOGRAPHY</a></li>
  <li><a href="artists.html">ARTIST PORTFOLIOS</a></li>
</ul>
</div>

在我制作的自定义CSS文件中，我尝试执行以下操作：

.nav .nav-pills .nav-justified li a {
    width: 50px;
}

但无济于事。我做这件事的正确方式是什么？还有谁能告诉我如何同时改变文本的颜色和nav-pill的颜色？我想使背景颜色透明。

Answer 1

您的CSS选择器不正确。前三个类之间的空格意味着它们是子类，而不是元素拥有所有三个类。

试着这样做：

.nav.nav-pill.nav-justified li a {
    width: 50px;
}

如果你不能让它工作，一把小提琴或其他东西将是有用的。