Question

我似乎无法摆脱页面标题和我的引导程序导航栏之间令人讨厌的空白区域。

主要CSS：

.navbar-default {
    background-color: #000000;
    border-color: #1a1a1a;
}
.navbar-default .navbar-brand {
    color: #ffffff;
}
.navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus {
    color: #ffffff;
}
.navbar-default .navbar-text {
    color: #ffffff;
}
.navbar-default .navbar-nav > li > a {
    color: #ffffff;
}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
    color: #ffffff;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    color: #ffffff;
    background-color: #1a1a1a;
}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
    color: #ffffff;
    background-color: #1a1a1a;
}
.navbar-default .navbar-toggle {
    border-color: #1a1a1a;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background-color: #1a1a1a;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #ffffff;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
    border-color: #ffffff;
}
.navbar-default .navbar-link {
    color: #ffffff;
}
.navbar-default .navbar-link:hover {
    color: #ffffff;
}
@media (max-width: 767px) {
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #ffffff;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #ffffff;
  }
    .navbar-default .navbar-nav .open .dropdown-menu > .active > a, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
        color: #ffffff;
        background-color: #1a1a1a;
    }
  .navbar-nav > li > a {
    line-height: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
  }
}
.navbar-static-top {
  min-height: 100px;
}
.navbar-nav > li > a {
  padding-top: 0px;
  padding-bottom: 0px;
  line-height: 100px;
}
#page-title {
  background-color: #FF9900;
}

我使用http://twbscolor.smarchal.com/为导航栏生成了CSS，因为我不太了解自定义引导程序。到目前为止，我已经尝试在CSS中更改不同的像素高度等，但没有任何效果。

提前致谢。

Answer 1

您的问题是＆＃34;您好！＆＃34; bar是H1，其中也包含上边距。

如果您想要修复它，请添加：

margin-bottom: 0;

到您的navbar-default和

style="margin-top: 0"

到H1

Answer 2

这里

.navbar-default {
background-color: #000000;
border-color: #1a1a1a;
margin-bottom: 0;
}
h1{
margin-top:0;
}

如果您不想篡改默认设置使用此

#page-title {
background-color: #FF9900;
position: relative;
top: -20px;
}

摆脱bootstrap导航栏底部的填充

2 个答案: