Bootstrap - 如何使Navbar按钮的宽度相等

Question

我有一个带有导航栏的引导程序。在导航栏中，我有五个按钮，如下所示：

其中一个按钮的Razor代码如下所示（其他四个按钮大致相同）：

<a href="#" class="dropdown-toggle btn btn-primary btn-lg" data-toggle="dropdown" style="border-radius: 20px;">Sign up<b class="caret"></b></a>

我想让按钮的宽度相同，但我似乎无法找到控制它的CSS。

Answer 1

首先，你必须弄清楚正确的CSS选择器（Chrome Inspect Element可以在这里提供帮助）。我怀疑它们可能嵌套在带有.nav类或其他类似的DIV或UL中。然后你可以设置宽度＆＃39; style.css中的属性（或任何样式表命名的文件）文件，或HTML中样式标记之间的属性。

如果您可以编辑HTML，只需添加类似＆＃34; nav-btn＆＃34;到你要修改的每个按钮。

因此，例如，如果您在此处添加了它的样子......

<强> HTML：

<a href="#" class="dropdown-toggle btn btn-primary btn-lg nav-btn" data-toggle="dropdown" style="border-radius: 20px;">Sign up<b class="caret"></b></a>

<强> CSS：

.nav-btn {
  width: 50px; //or whatever width/units you like that fits everything
}

或者，您可以使用<style>标记在HTML文件中添加CSS：

<style>
    .nav-btn {
      width: 50px; //or whatever width/units you like that fits everything
    }
</style>

Answer 2

width: 25%;

（这些是满足最低答案长度要求的更多字符）