轮播宽度仅显示 20%

Question

我试图让引导轮播显示 100%，但是当插入网站时，它只显示 20%。当单独测试文件时，它很好。请指教！

Answer 1

您可以在列 div 中添加一个类

<div class="no-padding col-lg-12  col-md-12 col-sm-12 col-xs-12" >

                          <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                                  <!-- Indicators -->
                                  <ol class="carousel-indicators">
                                    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                                    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                                    <li data-target="#carousel-example-generic" data-slide-to="2"></li>
                                  </ol>

                                  <!-- Wrapper for slides -->
                                  <div class="carousel-inner">
                                    <div class="item active">
                                      <img src="http://placehold.it/1024x700/CC1111/FFF" alt="First Slide">
                                      <div class="carousel-caption">
                                      First Slide
                                      </div>
                                    </div>
                                    <div class="item">
                                     <img src="http://placehold.it/1024x700/449955/FFF" alt="Second Slide">
                                      <div class="carousel-caption">
                                       Second Slide
                                      </div>
                                    </div>

                                        <div class="item">
                                     <img src="http://placehold.it/1024x700/" alt="Third Slide">
                                      <div class="carousel-caption">
                                       Third Slide
                                      </div>
                                    </div>

                                  </div>

                                  <!-- Controls -->
                                  <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
                                    <span class="glyphicon glyphicon-chevron-left"></span>
                                  </a>
                                  <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
                                    <span class="glyphicon glyphicon-chevron-right"></span>
                                  </a>
                        </div>





                   </div>

            </div>


</div>  

然后将这个类添加到你的css中

         .no-padding {
   padding: 0;
 }

I  have added a class because I do not want you to remove padding from the default column classes as you might need padding for some other structure.