css - 当窗口重新调整 Bootstrap 大小时内容自动隐藏

Question

以下潜水在窗口重新调整大小时自动隐藏。 一切似乎都是对的。只有图像显示。该图像是背景图像。

  <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
        <div class="carousel-inner">
            <div class="item active">
                <img src="img/lines1.jpg" alt="First slide">
          <div class="header-text hidden-xs">
              <div class="col-md-12 text-center">
                  <h2 style="font-size: 50px;">
                    <b style="color:white">Welcome to <i>We</i><b style="color:red;">Track</b>&#0153;</b>
                  </h2>
                  <h3>
                    <span style="font-size: 26px;">Track Your <b style="color:red;">Vehicles</b> with a new Level</span>
                  </h3>
                  <br>
                  <div class="">
                     <a class="btn btn-theme btn-sm btn-min-block" href="login.php"><b>Login</b></a><a class="btn btn-theme btn-sm btn-min-block" href="signup.php"><b>Signup</b></a></div>
              </div>
          </div>
            </div>
        </div>
    </div>

Answer 1

您应该将“hidden-xs”移动到图像父元素。

演示:http://jsfiddle.net/murid/nvpxtgae

    <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
        <div class="carousel-inner">
            <div class="item active hidden-xs">
                <img src="img/lines1.jpg" alt="First slide">
                <div class="header-text">
                    <div class="col-md-12 text-center">
                        <h2 style="font-size: 50px;">
                            <b style="color:white">Welcome to <i>We</i><b style="color:red;">Track</b>&#0153;</b>
                        </h2>
                        <h3>
                            <span style="font-size: 26px;">Track Your <b style="color:red;">Vehicles</b> with a new Level</span>
                        </h3>
                        <br>
                        <div class="">
                            <a class="btn btn-theme btn-sm btn-min-block" href="login.php"><b>Login</b></a><a class="btn btn-theme btn-sm btn-min-block" href="signup.php"><b>Signup</b></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>