Question

我想在移动版中更改导航栏中的最大高度。以下代码片段位于bootstrap.css文件中

@media (min-width: 768px) {
   .navbar-fixed-top .navbar-collapse,
   .navbar-fixed-bottom .navbar-collapse {
     max-height: 340px;
   }
}

我有一个自定义.css文件，我已经成功更改了导航栏的某些属性。要将max-heigt从340px更改为auto，我写了以下内容：

@media (max-width: 767px) {
.navbar-custom .navbar-nav .open .dropdown-menu > li > a {
  color: #DBFAFF
  }
 .navbar-custom .navbar-nav .open .dropdown-menu > li > a:hover,
 .navbar-custom .navbar-nav .open .dropdown-menu > li > a:focus  {
    color: #40F99B
  }
  .navbar-custom .navbar-fixed-top .navbar-collapse,
  .navbar-custom .navbar-fixed-bottom .navbar-collapse {
    max-height: auto;
  }
}

前两项更改正在进行中。

我的HTML文件中包含以下行：

<nav class="navbar-custom navbar navbar-inverse navbar-fixed-top ">

但是这并没有将max-height更改为auto。当我在chrome检查中更改340px时，它完全符合我的要求。

有谁知道这个问题是什么？

Answer 1

使用let load = function () { let promise = Promise.resolve(); for (let i = 0; i < 3; i++) { promise = promise.delay(3000).then(() => console.log(i) ); } }; load();或使用height:auto;可能对您有帮助。

!important

Answer 2

您的CSS选择器不正确：你应该删除.navbar-custom和.navbar-fixed-top中的空格字符！

并写道： .navbar-custom.navbar-fixed-top

Answer 3

如此快速的研究发现您可以在此站点更改这些变量： http://getbootstrap.com/customize/

@ navbar-collapse-max-height

或者LESS

在引导程序导航栏中更改最大高度

3 个答案: