Question

我目前正在使用bootstrap制作网站，但在主页背景图片的末尾有一段空白区域50px 长度。

是否有可能摆脱这条白色空间？我已经为该网站提供了我的html和css代码。非常感谢帮助。

HTML

     <!-- html-->
      <div id="title-page">
           <div class="container">
               <div id="nav" class="navbar navbar-inverse navbar-static-top">
      <div class="container">
          <a href="#" class="navbar-brand"></a>
          <button class="navbar-toggle" data-toggle="collapse" data-target=".navHeaderCollapse">
             <span class="icon-bar"></span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
          </button>
          <div class="collapse navbar-collapse navHeaderCollapse">
              <ul class="nav navbar-nav navbar-right">              
                <li><a href="#">Home</a></li>
                <li><a href="#">Portfolio</a></li>
                <li><a href="#">About</a></li>
                <li><a href="#">Contact</a></li>              
              </ul>
          </div>
      </div>
      </div>
               <div id="pic-headings">
               <h1 class=" text-center" ></h1><>
               <br>
               <h2 class=" text-center"></h2>
               </div>
           </div>
       </div>

CSS

 <!--css-->
#nav{
    margin-bottom: 0px;
    background-color: transparent;
    border: none;
    padding-right: 20px;

}
.navbar-brand{
    color: #fff;
}

#title-page{
    background-size: 100%;
    background-size: cover; 
    background-image: url(stephen1.jpg); 
    color: #fff;
    height: 830px;
    margin-bottom: 0px;
}
#pic-headings{
    padding-top: 200px;
    text-align: center;
}
h1{
    font-family: eb-garamond, sans-serif;
    -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;


}
h2{
    font-family: eb-garamond, sans-serif;
    -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;

}

Answer 1

在第24行，你有一些流浪汉字符＆lt;＆gt;这不能帮助你的情况。你可以考虑在没有嵌套容器类的情况下重构你的代码，并且整体上不会如此深入地嵌套你的div。在这样做的过程中，你肯定会发现问题。

请发布链接或jsfiddle或更多代码，以及您尝试使用哪个版本的Bootstrap来获取更多帮助。

这可能会或可能不会帮助您入门

<div id="header">
    <div class="container clearfix">
        <ul id="nav">
            <li></li>
        </ul>
    </div>
</div>
<div class="container">
    <div class="row-fluid">
        <div class="span12">
             something
        </div>
    </div>
</div>

使用bootstrap在网页底部的空间

1 个答案: