在固定透明标题引导程序下隐藏滚动内容

Sam*_*gNY 5 html css twitter-bootstrap twitter-bootstrap-3

我见过一些类似的问题,但解决方案可能不起作用,因为我正在使用引导程序。我的页面主体是垂直运行的两种颜色的渐变。表头是固定的,应采用相应的渐变颜色。因此我把它变成透明的。我想隐藏标题下的所有元素。

html

<!-- Fixed navbar -->
<nav class="navbar navbar-default navbar-fixed-top" >
<div class="container">
  <div class="navbar-header">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
        <span class="sr-only"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
  <h1 id="home-h1"><a href="index.html">title</a></h1>

  </div>
  <div id="navbar" class="navbar-collapse collapse">
    <ul class="nav navbar-nav">
      <li class="active"><a href="#">navitem</a></li>
      <li><a href="#navitem">navitem</a></li>
    </ul>
  </div><!--/.nav-collapse -->
</div>
Run Code Online (Sandbox Code Playgroud)

CSS

 body {

    background: -webkit-linear-gradient(#99DAD2, #FEECA4);
    background: linear-gradient(#99DAD2, #FEECA4);
}

 .navbar-default {
    /* navbar background color */
    background-color:transparent;
}
Run Code Online (Sandbox Code Playgroud)