Question

这是我的索引页

<body id="home">
  <section class="container">
    <header class="row">
      <?php include "components/php/header.php" ?>
    </header>
    <div class=" row">
      <div class="col col-lg-12">
        <?php include "components/php/main_carousel.php" ?>
      </div>
    </div>
  </section>
  <!-- Container -->
  <!-- Scripts -->
  <script src="js/jquery-v1.10.2.min.js"></script>
  <script src="js/bootstrap.min.js"></script>
  <script src="components/javascript/custom.js"></script>
</body>

这是我的旋转木马

<div id="main_carousel" class="carousel-slide" data-ride="carousel">
  <!-- Indicators -->
  <ol class="carousel-indicators">
    <li data-target="#main_carousel" data-slide-to="0" class="active"></li>
    <li data-target="#main_carousel" data-slide-to="1"></li>
    <li data-target="#main_carousel" data-slide-to="2"></li>
  </ol>
  <!-- Wrapper for slides -->
  <div class="carousel-inner">
    <div class="item active">
      <img src="images/carousel_main/1.jpg" alt="..." style="min-height:350px;
max-height:350px;min-width:100%;max-width:100%;">
      <div class="carousel-caption"></div>
    </div>
    <div class="item ">
      <img src="images/carousel_main/2.jpg" alt="..." style="min-height:350px;
max-height:350px;min-width:100%;max-width:100%;">
      <div class="carousel-caption"></div>
    </div>
    <div class="item ">
      <img src="images/carousel_main/3.jpg" alt="..." style="min-height:350px;
max-height:350px;min-width:100%;max-width:100%;">
      <div class="carousel-caption"></div>
    </div>
  </div>
  <!-- Controls -->
  <a class="left carousel-control" href="#main_carousel" data-slide="prev">
    <span class="glyphicon glyphicon-chevron-left"></span>
  </a>
  <a class="right carousel-control" href="#main_carousel" data-slide="next">
    <span class="glyphicon glyphicon-chevron-right"></span>
  </a>
</div>

演示 http://www.bootply.com/119365

这就是它的样子

why is there an extra space

..请帮我摆脱这个标有黄色的额外空间................................ .................................................. .................................................. ....

Answer 1

将.row添加到`id =“main_carousel”

<div id="main_carousel" class="carousel-slide row" data-ride="carousel">

http://www.bootply.com/119371

Bootstrap 3旋转木马，左右两侧有额外空间

1 个答案: