css - 降低折叠引导导航栏的高度

Question

这里面有什么办法可以降低导航栏的高度吗？ http://www.bootply.com/render/1dopQbJEMd .我在链接中使用完全相同的 css 属性。我尝试使用 css 中的高度属性。但它并没有减少。

Answer 1

检查代码后，我看到了

1. .navbar 有 min-height:50px ，把它改成 min-height:0 所以它会继承 height 来自它的内容

2. .navbar-brand 有padding:15px 15px，减少top和bottom padding你想要怎样，例如 padding:5px 15px

3. .navbar-nav>li>a 有 padding-top:15px;padding-bottom:15px 也减少到 5px 就像你在第 2 点所做的那样

4. .navbar-text 有 margin-top:15px;margin-bottom:15px ，也将它减少到 5px 作为你在第 2 点和第 3 点做了

最后你将拥有 CSS:

.navbar {
   min-height:0;
}
 .navbar-brand {
   padding:5px 15px;
}
.navbar-nav>li>a {
   padding-top:5px;
   padding-bottom:5px;
}
.navbar-text {
   margin-top:5px;
   margin-bottom:5px;
}

.navbar 的高度将为 30px，20px 比之前少