javascript - Bootstrap CSS 菜单框类型问题

Question

我正在 Bootstrap 中制作一个网站，但无法实现制作简单的菜单。

我想做这样的事情:

到目前为止，我已经实现了这一目标:

我尝试过，但无法使我的 CSS 正常工作。

这是我的 CSS 代码:

.navbar-nav li a {
    height: 90px;
    line-height: 60px;
    margin: 0 10px;
    background-color: #f1f1f1;
    font-size: 1.1em;
    border-radius: 10px;
}

如有任何帮助，我们将不胜感激。

Answer 1

检查这个 fiddle https://jsfiddle.net/gward90/h8cnbL5w/1/

要调整按钮的外观，请使用 .nav>li>a 的填充，这是 BS 默认 css 类。默认内边距值设置为 padding: 10px 15px

您还需要从 .navbar-nav li 中删除高度，该类使按钮变得如此之大，您也不需要行高。