jumbo-tron底部的间隙不能移除

时间:2017-11-14 14:40:47

标签: html css twitter-bootstrap

我正在使用jumbo tron来显示psd的英雄形象但是底部似乎有一个间隙我尝试使用margin-bottom:0px但是没有用。



.jumbotron
{

    background-image: url(image/background.png);
    background-repeat: no-repeat;
    -webkit-background-size:cover;
    -moz-background-size:cover;
    background-size: cover;
    padding: none !important;
    padding-bottom:none !important;
  margin-bottom: 0; 

} 

<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="Brand">Dipped</div>
            <div class="navbar-inner">
                <ul class="nav navbar-nav navbar-right">
                    <li><a href="#">Home</a></li>
                    <li><a href="#services">Services</a></li>
                    <li><a href="#works">Works</a></li>
                    <li><a href="#about">About</a></li>
                    <li><a href="#contact">Contact</a></li>
                </ul>
            </div>
        </div>


 <div class="jumbotron">
     <div class="jumpbotron-inner text-center">
  <h1>We build well desgined websites</h1>
  <p>Class aptent taciti sociosqu ad litora torquent per conubia nostra.</p>
  <p>
    <a class="btn btn-primary btn-large">
      Get Started
    </a>

      <a class="btn btn-primary btn-large">
    Learn More
    </a>

  </p>
           <img src="image/browser.png">
     </div>
</div>



    </body>
</html>
&#13;
&#13;
&#13;

enter image description here

但是正如你所看到的那样,浏览器图片和jumobo tron的底部之间有很大差距。

我起诉bootstrap 3.3.7作为参考

1 个答案:

答案 0 :(得分:0)

尝试这些搞乱这些变化

<span>
<a class="btn btn-primary btn-large">
  Get Started
</a>

  <a class="btn btn-primary btn-large">
Learn More
</a>
</span>

.jumbotron

{

background-image: url(image/background.png);
background-repeat: no-repeat;
-webkit-background-size:cover;
-moz-background-size:cover;
background-size: cover;
padding-bottom: 0px;
margin-bottom: 0px; 

}