如何减小 Bootstrap 菜单上的下拉菜单大小？答案

【问题标题】：How do I reduce drop-down size on Bootstrap menu?如何减小 Bootstrap 菜单上的下拉菜单大小？
【发布时间】：2017-12-28 21:03:38
【问题描述】：

我进行了多次搜索，但无法弄清楚如何减小 Bootstrap 菜单的下拉菜单大小。我已尝试修改 Bootstrap CSS 中与下拉菜单相关的所有内容，但无法更改。

我当前的 Bootstrap 下拉菜单：

我想缩小每个项目之间的空间。这是我当前的自定义导航 CSS：

.navbar-brand,
.navbar-nav li a {
    line-height: 100px;
    height: 100px;
    padding-top: 0;
}

【问题讨论】：

标签： html css twitter-bootstrap dropdown nav

【解决方案1】：

想通了。必须将此添加到我的 css 代码中：

.navbar-brand,
.navbar-nav li a {
    line-height: 100px;
    height: 100px;
    padding-top: 0;
}

.dropdown-menu li a {
    line-height: 100px;
    height: 100px;
    padding-top: 0;
}

【讨论】：

【解决方案2】：

删除line-height 和height 属性

.navbar-brand,
.navbar-nav li a {

    max-height: auto;
    padding-top: 0;
}

更新 1：

.navbar-brand,
.navbar-nav > li> a {
    line-height: 100px;
    height: 100px;
    padding-top: 0;
}

使用> 在根类下应用样式。

LIVE DEMO

【讨论】：

感谢您的回答，但我仍在尝试使用导航栏保持该高度。那些高度元素使它有 100px 高，我只是不希望它影响下拉菜单。
你能创建一个 plunker 演示吗？
@AKendrick 你看到我的演示了吗？